<template>
	<view>
		<view v-if="info==null">
			<zero-loading type="triangle"></zero-loading>
		</view>
		<view v-if="info!=null">
			<view class="event-help-details">
				<view class="map-content" style="height: 40vh">
					<view  style="height: 100%;" v-show="!is_opacity">
						<map id="map" class="map-gis" :latitude="map_latitude" :longitude="map_longitude" :markers="covers"
							:enable-building="true" :enable-traffic="false" :show-location="true" :polyline="polyline" :scale="scale" enable-3D="true" @regionchange="regionchange" >
							<cover-view class="controls-title">取送路线示意，非导航规划，请遵守交规</cover-view>
							<cover-image class="controls-play"  @click="handleMapRefresh()" src="https://www.cccshansong.com/chong_weapp/map_shuaxin3.png"></cover-image>
							<cover-image class="controls-play1"  @click="handleMapLocation()" src="https://www.cccshansong.com/chong_weapp/map_dingwei3.png"></cover-image>
						</map>
					</view>
				</view>
				<scroll-view  scroll-y="true" class="scroll_content_box">
					<view class="scroll_item_order_top_top_box" v-if="info.status=='DONE'">
						<view class="scroll_item_order_top_top_box_title">订单已送达</view>
						<view v-if="info.send_type == 2">
							<view class="scroll_item_order_status">一对一</view>
						</view>
						<view v-else>
							<view class="scroll_item_order_status" v-if="info.type == 1">外卖配送</view>
							<view class="scroll_item_order_status" v-if="info.type == 2">帮送</view>
							<view class="scroll_item_order_status" v-if="info.type == 3">帮取</view>
							<view class="scroll_item_order_status" v-if="info.type == 4">一对一</view>
							<view class="scroll_item_order_status" v-if="info.type == 5">帮我买</view>
						</view>
					</view>
					<view class="scroll_item_order_top_top_box" v-if="info.status=='CANCEL'">
						<view class="scroll_item_order_top_top_box_title">订单已取消</view>
						<view v-if="info.send_type == 2">
							<view class="scroll_item_order_status">一对一</view>
						</view>
						<view v-else>
							<view class="scroll_item_order_status" v-if="info.type == 1">外卖配送</view>
							<view class="scroll_item_order_status" v-if="info.type == 2">帮送</view>
							<view class="scroll_item_order_status" v-if="info.type == 3">帮取</view>
							<view class="scroll_item_order_status" v-if="info.type == 4">一对一</view>
							<view class="scroll_item_order_status" v-if="info.type == 5">帮我买</view>
						</view>
					</view>
					<view class="scroll_item_order_top_top_box" v-if="info.status=='RIDER_CANCEL'">
						<view class="scroll_item_order_top_top_box_title">骑手已取消</view>
						<view v-if="info.send_type == 2">
							<view class="scroll_item_order_status">一对一</view>
						</view>
						<view v-else>
							<view class="scroll_item_order_status" v-if="info.type == 1">外卖配送</view>
							<view class="scroll_item_order_status" v-if="info.type == 2">帮送</view>
							<view class="scroll_item_order_status" v-if="info.type == 3">帮取</view>
							<view class="scroll_item_order_status" v-if="info.type == 4">一对一</view>
							<view class="scroll_item_order_status" v-if="info.type == 5">帮我买</view>
						</view>
					</view>
					<view class="violation_content_box" @click="goViolation(info.wallet[0].id)" v-if="info.wallet_count>0">
						<view class="violation_content_left_box">
							违规：{{info.wallet[0].titile}}
						</view>
						<view class="violation_content_right_box">
							<view class="violation_content_right_btn" hover-class="hover_class"  v-if="info.refuse==null">我要申诉</view>
							<image src="https://www.cccshansong.com/chong_weapp/drawer_icon3.png" mode=""></image>
						</view>
					</view>
					<view class="orderInfo">
						<view class="li">
							<view class="top">
								<view class="fl">
									<view class="h1"><text>￥</text>{{info.price_complete.rider_actual_price}}</view>
								</view>
								<view class="fr" v-if="info.is_pre_order!=1&&(info.status=='PENDING' || info.status=='GRABBED' || info.status=='PICKUP' || info.status=='DELIVERING')">
									<template v-if="info.delay_delivery_time[0]>=0">
										<view class="h2">{{info.delay_delivery_time[0]}}分钟内</view>
										<view class="h3">({{info.delay_delivery_time[1].slice(11,16)}})前送达</view>
									</template>
									<template v-if="info.delay_delivery_time[0]<0">
										<view class="h2">[已超时]{{info.delay_delivery_time[1].slice(5,16)}}</view>
										<view class="h3">前送达</view>
									</template>
								</view>
								<view class="fr" v-if="info.is_pre_order==1&&(info.status=='PENDING' || info.status=='GRABBED' || info.status=='PICKUP' || info.status=='DELIVERING')">
									<view class="h1">
										<image src="../../static/images/icon06.png"></image>
										<text>预</text>
									</view>
									<view class="h2" v-if="info.delay_delivery_time[0]<0">[已超时]</view>
									<view class="h2" v-if="info.delay_delivery_time">{{info.delay_delivery_time[1].substring(5,22)}}</view>
									<!--									<view class="h3">送达</view>-->
								</view>
								<view class="fr" v-if="info.status!='PENDING' && info.status!='GRABBED' && info.status!='PICKUP' && info.status!='DELIVERING'">
									<!--<view class="h2">12分钟内</view>
									<view class="h3">(12)前送达</view>-->
								</view>
							</view>
							<view class="center">
								<view class="start">
									<view class="fl">
										<view class="h1">
											<view class="h1Fl">
												<view class="point"></view>
												<view class="distance">
													<view class="num">{{info.receiver_address_detail_complete.rider}}</view>
													<view class="km">KM</view>
												</view>
											</view>
											<view class="h1Fr">
												<view class="big" v-if="info.merchant">{{info.merchant.shop_name?info.merchant.shop_name:'--'}}</view>
												<view class="small">{{info.sender_address}}</view>
											</view>
										</view>
										<view class="h2">
											<image src="../../static/images/icon07.png"></image>
											<view class="h2Con">
												<view class="num">{{info.sender_address_detail_complete.rider}}</view>
												<view class="km">KM</view>
											</view>
										</view>
									</view>
									<view class="fr">
										<image src="../../static/images/icon46.png" @click.stop="handleMap(info.sender_address_detail_complete,info.sender_address)"></image>
									</view>
								</view>
								<view class="end">
									<view class="fl">
										<view class="h1">
											<view class="h1Fl">
												<view class="point"></view>
												<view class="distance">
													<view class="num">{{info.sender_address_detail_complete.rider}}</view>
													<view class="km">KM</view>
												</view>
											</view>
											<view class="h1Fr">
												<view class="big">{{info.receiver_address}}</view>
												<view class="small">
													备注：<text>{{info.remark}}</text>
												</view>
												<view class="phone">
													<view class="h4" @click.stop="handleCustomer()">
														<text>{{info.receiver}}:{{info.receiver_phone.slice(0,3)}}****<text>{{info.receiver_phone.slice(7,11)}}</text></text>
														<image src="../../static/images/icon47.png"></image>
													</view>


													<view v-if="info.send_type == 2">
														<view class="h5">一对一</view>
													</view>
													<view v-else>
														<view class="h5" v-if="info.type == 1">外卖配送</view>
														<view class="h5" v-if="info.type == 2">帮送</view>
														<view class="h5" v-if="info.type == 3">帮取</view>
														<view class="h5" v-if="info.type == 4">一对一</view>
														<view class="h5" v-if="info.type == 5">帮我买</view>
													</view>
												</view>
											</view>
										</view>
									</view>
									<view class="fr">
										<image src="../../static/images/icon46.png" @click.stop="handleMap(info.receiver_address_detail_complete,info.receiver_address)"></image>
									</view>
								</view>
								<view class="notes">
									<view class="h1">备注：</view>
									<view class="h2">{{info.item_type ? info.item_type + ',' : ''}}{{info.delivery_method1 ? info.delivery_method1 + '，' : ''}}{{info.remark}}</view>
								</view>
							</view>
						</view>
					</view>
					<!--<view class="order_content_box">
						<view class="scroll_item_order_top_box">
							&lt;!&ndash; <view class="scroll_item_order_top_time">
								<image src="https://www.cccshansong.com/chong_weapp/time_icon.png" mode=""></image>{{info.delay_delivery_time.slice(5,16)}}  <text v-if="info.is_pre_order==1">预约单</text>
							</view> &ndash;&gt;
							<view class="scroll_item_order_top_price">
								&lt;!&ndash; <view class="scroll_item_order_top_price_tip">含天气奖励¥1.5</view> &ndash;&gt;
								<view class="scroll_item_order_top_price_num">
									<text>¥</text>{{info.price_complete.rider_actual_price}}
								</view>
							</view>
							<view class="scroll_item_order_top_time"  v-if="info.is_pre_order!=1&&(info.status=='PENDING' || info.status=='GRABBED' || info.status=='PICKUP' || info.status=='DELIVERING')">
								<text v-if="info.delay_delivery_time[0]>=0">
									<text style="font-weight: bold;">{{info.delay_delivery_time[0]}}分钟内 </text>
									<text style="color: #666;">(</text>
									<text style="color: #666;">
									{{info.delay_delivery_time[1].slice(11,16)}}
									</text>
									<text style="color: #666;">前)送达</text>
								</text>
								<text v-if="info.delay_delivery_time[0]<0">
									<text style="font-weight: bold;">[已超时]{{info.delay_delivery_time[1].slice(5,16)}} </text>
									<text style="color: #666;">前送达</text>
								</text>
							</view>
							<view class="scroll_item_order_top_time"  v-if="info.is_pre_order==1&&(info.status=='PENDING' || info.status=='GRABBED' || info.status=='PICKUP' || info.status=='DELIVERING')">
								<text class="yu">预</text>
								<text style="font-weight: bold;">
									<text v-if="info.delay_delivery_time[0]<0"> [已超时]</text>{{info.delay_delivery_time[1].slice(5,16)}}
								</text>
								<text style="color: #333;">送达 </text>
							</view>
							<view class="scroll_item_order_top_time" v-if="info.status!='PENDING' && info.status!='GRABBED' && info.status!='PICKUP' && info.status!='DELIVERING'">

							</view>
						</view>
						<view class="scroll_item_order_no_box" v-if="info.order_sequence!=null">
							&lt;!&ndash; <view class="scroll_item_order_no_left">订单配送</view> &ndash;&gt;
							<view class="order_content_title" style="margin-bottom: 0;">
								<view class="order_content_title_xian"></view>
								<view class="order_content_title_text">取餐号</view>
							</view>
							<view class="scroll_item_order_no_right"><text>#</text>{{info.order_sequence}}</view>
						</view>
						<view class="scroll_item_order_center_box">
							<view class="qu_address_item_box">
								<view class="qu_address_item_left_box">
									<view class="qu_address_icon_box_content">
										<view class="qu_address_icon_box">
											<image src="https://www.cccshansong.com/chong_weapp/qu_icon.png" mode="" ></image>
											&lt;!&ndash; <view class="qu_address_distance_title" style="color: #333;font-size: 28rpx;font-weight: 600;">{{info.receiver_address_detail_complete.rider}}</view>
											<view class="qu_address_distance_title" style="color: #606266;font-size: 18rpx;margin-top: -6rpx;">KM</view> &ndash;&gt;
										</view>
										<view class="qu_address_xian_box">
											&lt;!&ndash; <image
												src="https://www.cccshansong.com/chong_weapp/qu_address_xian_box1.png"
												mode="" ></image> &ndash;&gt;
											<view class="qu_address_xian_box_container">
												<view class="qu_address_distance_title" style="color: #000;font-size: 20rpx;font-weight: bold;">
												{{info.sender_address_detail_complete.rider}}
												</view>
												<view class="qu_address_distance_title" style="color: #000;font-size: 18rpx;margin-top: -6rpx;">KM</view>
											</view>
										</view>
									</view>

									<view class="qu_address_box">
										<view class="qu_address_title" v-if="info.merchant">{{info.merchant.shop_name?info.merchant.shop_name:'&#45;&#45;'}}</view>
										<view class="qu_address_desc">{{info.sender_address}}</view>
									</view>
								</view>
								<view class="dh_icon_box" @click.stop="handleMap(info.sender_address_detail_complete,info.sender_address)">
									<image src="https://www.cccshansong.com/chong_weapp/dh_icon.png" mode=""></image>
								</view>
							</view>
							<view class="qu_address_item_box">
								<view class="qu_address_item_left_box">
									<view class="qu_address_icon_box_content">
										<view class="qu_address_icon_box">
											<image src="https://www.cccshansong.com/chong_weapp/song_icon.png" mode=""></image>
											&lt;!&ndash; <view class="qu_address_distance_title" style="color: #333;font-size: 28rpx;font-weight: 600;">{{info.sender_address_detail_complete.rider}}</view>
											<view class="qu_address_distance_title" style="color: #606266;font-size: 18rpx;margin-top: -6rpx;">KM</view> &ndash;&gt;
										</view>
									</view>
									<view class="qu_address_box">
										<view class="qu_address_title">{{info.receiver_address}}</view>
										&lt;!&ndash; <view class="qu_address_desc">沂蒙路九州购物广场沂蒙路九州购物广场沂蒙路九州购物广场沂蒙路九州购物广场沂蒙路九州购物广场档位B-02号</view>	 &ndash;&gt;
									</view>
								</view>
								<view class="dh_icon_box" @click.stop="handleMap(info.receiver_address_detail_complete,info.receiver_address)">
									<image src="https://www.cccshansong.com/chong_weapp/dh_icon.png" mode=""></image>
								</view>
							</view>
							<view class="scroll_item_order_status_box">
								<view class="scroll_item_order_status_phone" @click.stop="handleCustomer()">
									{{info.receiver}}:{{info.receiver_phone.slice(0,3)}}****<text>{{info.receiver_phone.slice(7,11)}}</text> <image src="https://www.cccshansong.com/chong_weapp/phone_icon.png" mode=""></image>
								</view>
								<view class="scroll_item_order_status">外卖配送</view>
							</view>
							<view class="scroll_item_order_remark_box" v-if="info.remark!=null">
								<text>备注：</text>{{info.remark}}
							</view>
						</view>

					</view>-->
					<view class="order_content_box_heng" v-if="info.infos.length>0"></view>
					<view class="order_content_box" v-if="info.infos.length>0">
						<view class="order_content_title">
							<view class="order_content_title_xian"></view>
							<view class="order_content_title_text">商品信息</view>
						</view>
						<view class="order_content_info_item_box" v-for="(data,index) in info.infos" :key="index">
							<view class="order_content_info_item_box_left" style="display: flex;">
								<view style="max-width: 420rpx;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;word-break: break-all;">
									{{data.name}}
								</view>
								<text>x{{data.number}}</text>
							</view>
							<view class="order_content_info_item_box_right">¥{{data.price}}</view>
						</view>
						<!-- <view class="order_content_info_item_box">
							<view class="order_content_info_item_box_left">价格</view>
							<view class="order_content_info_item_box_right">¥{{info.info.price}}</view>
						</view> -->
					</view>
					<view class="order_content_box_heng"></view>
					<view class="order_content_box">
						<view class="order_content_title">
							<view class="order_content_title_xian"></view>
							<view class="order_content_title_text">订单信息</view>
						</view>
						<!-- <view class="order_content_info_item_box">
							<view class="order_content_info_item_box_left">订单类型</view>
							<view class="order_content_info_item_box_right">订单包，共1单</view>
						</view> -->
						<view class="order_content_info_item_box">
							<view class="order_content_info_item_box_left">预估金额</view>
							<view class="order_content_info_item_box_right">¥{{info.predict_price}}</view>
						</view>
						<view class="order_content_info_item_box">
							<view class="order_content_info_item_box_left">订单号码</view>
							<view class="order_content_info_item_box_right">{{info.order_no}}<view class="order_content_info_item_box_right_copy" @click="handleCopy(info.order_no)">复制</view></view>
						</view>
						<view class="order_content_info_item_box">
							<view class="order_content_info_item_box_left">期望送达</view>
							<view class="order_content_info_item_box_right">{{info.delay_delivery_time[1].slice(5,16)}}</view>
						</view>
					</view>
					<view class="order_content_box_heng"></view>
					<view class="order_content_box">
						<view class="order_content_title_box">
							<view class="order_content_title">
								<view class="order_content_title_xian"></view>
								<view class="order_content_title_text">订单收入</view>
							</view>
							<view class="order_content_title_rule" @click="goArticle()">
								<image src="https://www.cccshansong.com/chong_weapp/order_detail_icon3.png" mode=""></image>结算细则
							</view>
						</view>
						<view class="order_content_title_tip">未包含参与活动的奖励</view>
						<view class="order_content_info_item_box">
							<view class="order_content_info_item_box_left">配送费</view>
							<view class="order_content_info_item_box_right">¥{{info.price_complete.rider_discount_price}}</view>
						</view>
						<!-- <view class="order_content_info_item_box">
							<view class="order_content_info_item_box_left">服务费</view>
							<view class="order_content_info_item_box_right">¥{{info.price_complete.rider_base_fee}}</view>
						</view>	 -->
						<view class="order_content_info_item_box">
							<view class="order_content_info_item_box_left">骑手基础运费</view>
							<view class="order_content_info_item_box_right">¥{{info.price_complete.rider_base_price}}</view>
						</view>
						<view class="order_content_info_item_box">
							<view class="order_content_info_item_box_left">重量费用</view>
							<view class="order_content_info_item_box_right">¥{{info.price_complete.weight}}</view>
						</view>
						<view class="order_content_info_item_box">
							<view class="order_content_info_item_box_left">恶劣天气补贴</view>
							<view class="order_content_info_item_box_right">¥{{info.price_complete.bad_weather}}</view>
						</view>
						<view class="order_content_info_item_box">
							<view class="order_content_info_item_box_left">特殊时段补贴</view>
							<view class="order_content_info_item_box_right">¥{{info.price_complete.special_time_fee}}</view>
						</view>
						<view class="order_content_info_item_box">
							<view class="order_content_info_item_box_left">小费</view>
							<view class="order_content_info_item_box_right">¥{{info.price_complete.tips}}</view>
						</view>
						<view class="order_content_info_item_box"  v-if="info.status=='DONE'">
							<view class="order_content_info_item_box_left">平台抽成</view>
							<view class="order_content_info_item_box_right">¥{{info.price_complete.cut_fee}}</view>
						</view>
						<view class="order_content_info_item_box">
							<view class="order_content_info_item_box_left">合计</view>
							<view class="order_content_info_item_box_right"><text>¥{{info.price_complete.rider_actual_price}}</text></view>
						</view>
					</view>
					<view class="order_content_box_heng" v-if="info.pick_image!=null"></view>
					<view class="order_content_box" v-if="info.pick_image!=null">
						<view class="order_content_title">
							<view class="order_content_title_xian"></view>
							<view class="order_content_title_text">到店照片</view>
						</view>
						<view class="order_content_img_box">
							<view class="order_content_img_item" @click="handlePreview(index,info.pick_image_complete)" v-for="(data,index) in info.pick_image_complete" :key="index">
								<image :src="data" mode="aspectFill"></image>
							</view>
						</view>
					</view>
					<view class="order_content_box_heng" v-if="info.delivery_image!=null"></view>
					<view class="order_content_box" v-if="info.delivery_image!=null">
						<view class="order_content_title">
							<view class="order_content_title_xian"></view>
							<view class="order_content_title_text">取货照片</view>
						</view>
						<view class="order_content_img_box">
							<view class="order_content_img_item" @click="handlePreview(index,info.delivery_image_complete)" v-for="(data,index) in info.delivery_image_complete" :key="index">
								<image :src="data" mode="aspectFill"></image>
							</view>
						</view>
					</view>
					<view class="order_content_box_heng" v-if="info.image!=null"></view>
					<view class="order_content_box" v-if="info.image!=null">
						<view class="order_content_title">
							<view class="order_content_title_xian"></view>
							<view class="order_content_title_text">送达照片</view>
						</view>
						<view class="order_content_img_box">
							<view class="order_content_img_item" @click="handlePreview(index,info.image_complete)" v-for="(data,index) in info.image_complete" :key="index">
								<image :src="data" mode="aspectFill"></image>
							</view>
						</view>
					</view>
					<view class="order_content_box_heng"></view>
					<view class="order_content_box">
						<view class="order_content_title_box">
							<view class="order_content_title">
								<view class="order_content_title_xian"></view>
								<view class="order_content_title_text">要求送达 </view>
							</view>
							<view class="order_content_title_rule1">
								{{info.delay_delivery_time[1].slice(5,16)}}
							</view>
						</view>
						<view class="order_content_time_box">
							<view class="order_content_time_item_box">
								<view class="order_content_time_item_time">{{info.created_at!=null  ?info.created_at.slice(11,16):'-'}}</view>
								<view class="order_content_time_item_name">下单</view>
							</view>
							<view class="order_content_time_item_box">
								<view class="order_content_time_item_time">{{info.order_at!=null ?info.order_at.slice(11,16):'-'}}</view>
								<view class="order_content_time_item_name">抢单</view>
							</view>
							<view class="order_content_time_item_box">
								<view class="order_content_time_item_time">{{info.reach_merchant_at!=null ?info.reach_merchant_at.slice(11,16):'-'}}</view>
								<view class="order_content_time_item_name">到店</view>
							</view>
							<view class="order_content_time_item_box">
								<view class="order_content_time_item_time">{{info.pick_at!=null ?info.pick_at.slice(11,16):'-'}}</view>
								<view class="order_content_time_item_name">取货</view>
							</view>
							<view class="order_content_time_item_box">
								<view class="order_content_time_item_time">{{info.delivery_at!=null ?info.delivery_at.slice(11,16):'-'}}</view>
								<view class="order_content_time_item_name">送达</view>
							</view>
						</view>

					</view>
					<view  style="height:150rpx;"></view>
				</scroll-view>
				<!-- <view class="map-content" :style="'height:' + mapHeight + 'px'">
					<map id="map" class="map-gis" :latitude="map_latitude" :longitude="map_longitude" :markers="covers"
						:enable-building="true" :enable-traffic="false" :show-location="true" :polyline="polyline" :scale="scale" enable-3D="true" @regionchange="regionchange" >
						<cover-view class="controls-title">取送路线示意，非导航规划，请遵守交规</cover-view>
						<cover-image class="controls-play"  @click="handleMapRefresh()" src="https://www.cccshansong.com/chong_weapp/map_shuaxin3.png"></cover-image>
						<cover-image class="controls-play1"  @click="handleMapLocation()" src="https://www.cccshansong.com/chong_weapp/map_dingwei3.png"></cover-image>
					</map>
				</view>
				<movable-area class="move-content" @touchmove.stop>
					<movable-view class="move-incontent" :style="'height:' + movableHeight + 'px'" :y="initY" inertia
						:damping="10" :friction="1" direction="vertical" :animation="false" @change="movableChange"
						@touchend="touchEnd">
						<view class="move-drag-ico" @click.stop="openHide">
							<image class="drag-img" :class="{'drag-transform':drageIco == 'up'}"
								src="https://www.cccshansong.com/chong_weapp/map_top_icon.png"
								mode=""></image>
						</view>
						<view class="move-infos-body" style="height: calc(100% - 50px);">
							<scroll-view style="height: 100%;" :scroll-y="initY == canDragTop">
								<view class="scroll_item_order_top_top_box" v-if="info.status=='DONE'">
									<view class="scroll_item_order_top_top_box_title">订单已送达</view>
									<view class="scroll_item_order_status">外卖配送</view>
								</view>
								<view class="scroll_item_order_top_top_box" v-if="info.status=='CANCEL'">
									<view class="scroll_item_order_top_top_box_title">订单已取消</view>
									<view class="scroll_item_order_status">外卖配送</view>
								</view>
								<view class="scroll_item_order_top_top_box" v-if="info.status=='RIDER_CANCEL'">
									<view class="scroll_item_order_top_top_box_title">骑手已取消</view>
									<view class="scroll_item_order_status">外卖配送</view>
								</view>
								<view class="violation_content_box" @click="goViolation(info.wallet[0].id)" v-if="info.wallet_count>0">
									<view class="violation_content_left_box">
										违规：{{info.wallet[0].titile}}
									</view>
									<view class="violation_content_right_box">
										<view class="violation_content_right_btn" hover-class="hover_class"  v-if="info.refuse==null">我要申诉</view>
										<image src="https://www.cccshansong.com/chong_weapp/drawer_icon3.png" mode=""></image>
									</view>
								</view>
								<view class="order_content_box">
									<view class="scroll_item_order_top_box">
										<view class="scroll_item_order_top_time" v-if="info.is_pre_order!=1">
											<text v-if="info.delay_delivery_time[0]>=0">
												<text style="font-weight: 600;">{{info.delay_delivery_time[0]}}分钟内 </text>
												<text style="color: #333;">(</text>
												<text style="color: #333;">
												{{info.delay_delivery_time[1].slice(11,16)}}
												</text>
												<text style="color: #333;">前)送达</text>
											</text>
											<text v-if="info.delay_delivery_time[0]<0">
												<text style="font-weight: 600;">[已超时]{{info.delay_delivery_time[1].slice(5,16)}} </text>
												<text style="color: #333;">前送达</text>
											</text>
										</view>
										<view class="scroll_item_order_top_time" v-if="info.is_pre_order==1">
											<text class="yu">预</text>
											<text style="font-weight: 600;">
												<text v-if="info.delay_delivery_time[0]<0"> [已超时]</text>{{info.delay_delivery_time[1].slice(5,16)}}
											</text>
											<text style="color: #333;">送达 </text>
										</view>
										<view class="scroll_item_order_top_price">
											<view class="scroll_item_order_top_price_num">
												<text>¥</text>{{info.price_complete.rider_actual_price}}
											</view>
										</view>
									</view>
									<view class="scroll_item_order_no_box" v-if="info.order_sequence!=null">
										<view class="order_content_title" style="margin-bottom: 0;">
											<view class="order_content_title_xian"></view>
											<view class="order_content_title_text">取餐号</view>
										</view>
										<view class="scroll_item_order_no_right"><text>#</text>{{info.order_sequence}}</view>
									</view>
									<view class="scroll_item_order_center_box">
										<view class="qu_address_item_box">
											<view class="qu_address_item_left_box">
												<view class="qu_address_icon_box_content">
													<view class="qu_address_icon_box">
														<image src="https://www.cccshansong.com/chong_weapp/qu_icon.png" mode="" ></image>
													</view>
													<view class="qu_address_xian_box">
														<view class="qu_address_xian_box_container">
															<view class="qu_address_distance_title" style="color: #000;font-size: 20rpx;font-weight: 600;">
															{{info.sender_address_detail_complete.rider}}
															</view>
															<view class="qu_address_distance_title" style="color: #000;font-size: 18rpx;margin-top: -6rpx;">KM</view>
														</view>
													</view>
												</view>

												<view class="qu_address_box">
													<view class="qu_address_title">{{info.merchant.shop_name}}</view>
													<view class="qu_address_desc">{{info.sender_address}}</view>
												</view>
											</view>
											<view class="dh_icon_box" @click.stop="handleMap(info.sender_address_detail_complete,info.sender_address)">
												<image src="https://www.cccshansong.com/chong_weapp/dh_icon.png" mode=""></image>
											</view>
										</view>
										<view class="qu_address_item_box">
											<view class="qu_address_item_left_box">
												<view class="qu_address_icon_box_content">
													<view class="qu_address_icon_box">
														<image src="https://www.cccshansong.com/chong_weapp/song_icon.png" mode=""></image>
													</view>
												</view>
												<view class="qu_address_box">
													<view class="qu_address_title">{{info.receiver_address}}</view>
												</view>
											</view>
											<view class="dh_icon_box" @click.stop="handleMap(info.receiver_address_detail_complete,info.receiver_address)">
												<image src="https://www.cccshansong.com/chong_weapp/dh_icon.png" mode=""></image>
											</view>
										</view>
										<view class="scroll_item_order_status_box">
											<view class="scroll_item_order_status_phone" @click.stop="handleCustomer()">
												{{info.receiver}}:{{info.receiver_phone.slice(0,3)}}****<text>{{info.receiver_phone.slice(7,11)}}</text> <image src="https://www.cccshansong.com/chong_weapp/phone_icon.png" mode=""></image>
											</view>
											<view class="scroll_item_order_status">外卖配送</view>
										</view>
										<view class="scroll_item_order_remark_box" v-if="info.remark!=null">
											<text>备注：</text>{{info.remark}}
										</view>
									</view>

								</view>
								<view class="order_content_box_heng" v-if="info.info!=null"></view>
								<view class="order_content_box" v-if="info.info!=null">
									<view class="order_content_title">
										<view class="order_content_title_xian"></view>
										<view class="order_content_title_text">商品信息</view>
									</view>
									<view class="order_content_info_item_box">
										<view class="order_content_info_item_box_left" style="width: 460rpx;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;word-break: break-all;">{{info.info.name}}</view>
										<view class="order_content_info_item_box_right">x{{info.info.number}}</view>
									</view>
									<view class="order_content_info_item_box">
										<view class="order_content_info_item_box_left">价格</view>
										<view class="order_content_info_item_box_right">¥{{info.info.price}}</view>
									</view>
								</view>
								<view class="order_content_box_heng"></view>
								<view class="order_content_box">
									<view class="order_content_title">
										<view class="order_content_title_xian"></view>
										<view class="order_content_title_text">订单信息</view>
									</view>
									<view class="order_content_info_item_box">
										<view class="order_content_info_item_box_left">订单号码</view>
										<view class="order_content_info_item_box_right">{{info.order_no}}<view class="order_content_info_item_box_right_copy" @click="handleCopy(info.order_no)">复制</view></view>
									</view>
									<view class="order_content_info_item_box">
										<view class="order_content_info_item_box_left">期望送达</view>
										<view class="order_content_info_item_box_right">{{info.delay_delivery_time[1].slice(5,16)}}</view>
									</view>
								</view>
								<view class="order_content_box_heng"></view>
								<view class="order_content_box">
									<view class="order_content_title_box">
										<view class="order_content_title">
											<view class="order_content_title_xian"></view>
											<view class="order_content_title_text">订单收入</view>
										</view>
										<view class="order_content_title_rule" @click="goArticle()">
											<image src="https://www.cccshansong.com/chong_weapp/order_detail_icon3.png" mode=""></image>结算细则
										</view>
									</view>
									<view class="order_content_title_tip">未包含参与活动的奖励</view>
									<view class="order_content_info_item_box">
										<view class="order_content_info_item_box_left">配送费</view>
										<view class="order_content_info_item_box_right">¥{{info.price_complete.rider_discount_price}}</view>
									</view>
									<view class="order_content_info_item_box">
										<view class="order_content_info_item_box_left">骑手基础运费</view>
										<view class="order_content_info_item_box_right">¥{{info.price_complete.rider_base_price}}</view>
									</view>
									<view class="order_content_info_item_box">
										<view class="order_content_info_item_box_left">重量费用</view>
										<view class="order_content_info_item_box_right">¥{{info.price_complete.weight}}</view>
									</view>
									<view class="order_content_info_item_box">
										<view class="order_content_info_item_box_left">恶劣天气补贴</view>
										<view class="order_content_info_item_box_right">¥{{info.price_complete.bad_weather}}</view>
									</view>
									<view class="order_content_info_item_box">
										<view class="order_content_info_item_box_left">特殊时段补贴</view>
										<view class="order_content_info_item_box_right">¥{{info.price_complete.special_time_fee}}</view>
									</view>
									<view class="order_content_info_item_box">
										<view class="order_content_info_item_box_left">小费</view>
										<view class="order_content_info_item_box_right">¥{{info.price_complete.tips}}</view>
									</view>
									<view class="order_content_info_item_box"  v-if="info.status=='DONE'">
										<view class="order_content_info_item_box_left">平台抽成</view>
										<view class="order_content_info_item_box_right">¥{{info.price_complete.cut_fee}}</view>
									</view>
									<view class="order_content_info_item_box">
										<view class="order_content_info_item_box_left">合计</view>
										<view class="order_content_info_item_box_right"><text>¥{{info.price_complete.rider_actual_price}}</text></view>
									</view>
								</view>
								<view class="order_content_box_heng" v-if="info.pick_image!=null"></view>
								<view class="order_content_box" v-if="info.pick_image!=null">
									<view class="order_content_title">
										<view class="order_content_title_xian"></view>
										<view class="order_content_title_text">到店照片</view>
									</view>
									<view class="order_content_img_box">
										<view class="order_content_img_item" @click="handlePreview(index,info.pick_image_complete)" v-for="(data,index) in info.pick_image_complete" :key="index">
											<image :src="data" mode="aspectFill"></image>
										</view>
									</view>
								</view>
								<view class="order_content_box_heng" v-if="info.delivery_image!=null"></view>
								<view class="order_content_box" v-if="info.delivery_image!=null">
									<view class="order_content_title">
										<view class="order_content_title_xian"></view>
										<view class="order_content_title_text">取货照片</view>
									</view>
									<view class="order_content_img_box">
										<view class="order_content_img_item" @click="handlePreview(index,info.delivery_image_complete)" v-for="(data,index) in info.delivery_image_complete" :key="index">
											<image :src="data" mode="aspectFill"></image>
										</view>
									</view>
								</view>
								<view class="order_content_box_heng" v-if="info.image!=null"></view>
								<view class="order_content_box" v-if="info.image!=null">
									<view class="order_content_title">
										<view class="order_content_title_xian"></view>
										<view class="order_content_title_text">送达照片</view>
									</view>
									<view class="order_content_img_box">
										<view class="order_content_img_item" @click="handlePreview(index,info.image_complete)" v-for="(data,index) in info.image_complete" :key="index">
											<image :src="data" mode="aspectFill"></image>
										</view>
									</view>
								</view>
								<view class="order_content_box_heng"></view>
								<view class="order_content_box">
									<view class="order_content_title_box">
										<view class="order_content_title">
											<view class="order_content_title_xian"></view>
											<view class="order_content_title_text">要求送达 </view>
										</view>
										<view class="order_content_title_rule1">
											{{info.delay_delivery_time[1].slice(5,16)}}
										</view>
									</view>
									<view class="order_content_time_box">
										<view class="order_content_time_item_box">
											<view class="order_content_time_item_time">{{info.created_at!=null  ?info.created_at.slice(11,16):'-'}}</view>
											<view class="order_content_time_item_name">下单</view>
										</view>
										<view class="order_content_time_item_box">
											<view class="order_content_time_item_time">{{info.order_at!=null ?info.order_at.slice(11,16):'-'}}</view>
											<view class="order_content_time_item_name">抢单</view>
										</view>
										<view class="order_content_time_item_box">
											<view class="order_content_time_item_time">{{info.reach_merchant_at!=null ?info.reach_merchant_at.slice(11,16):'-'}}</view>
											<view class="order_content_time_item_name">到店</view>
										</view>
										<view class="order_content_time_item_box">
											<view class="order_content_time_item_time">{{info.pick_at!=null ?info.pick_at.slice(11,16):'-'}}</view>
											<view class="order_content_time_item_name">取货</view>
										</view>
										<view class="order_content_time_item_box">
											<view class="order_content_time_item_time">{{info.delivery_at!=null ?info.delivery_at.slice(11,16):'-'}}</view>
											<view class="order_content_time_item_name">送达</view>
										</view>
									</view>

								</view>
								<view  style="height:280rpx;"></view>
							</scroll-view>

						</view>


					</movable-view>
				</movable-area>
			 -->
			</view>
			<view class="fix_kf_box" @click="handleShowKf()">
				<image src="https://www.cccshansong.com/chong_weapp/order_detail_icon4.png" mode=""></image><text>客服</text>
			</view>




			<!--<view class="fix_detail_box" v-if="info.status=='DELIVERING'">
				<view class="scroll_item_order_btn3" hover-class="hover_class" @click="handleCallStore(info.sender_phone)" style="margin-right:34rpx;">
					<image src="https://www.cccshansong.com/chong_weapp/order_detail_icon1.png" mode=""></image><text>联系商家</text>
				</view>
				<view class="scroll_item_order_btn5" hover-class="hover_class" @click.stop="handleGrabDone()" style="width: 574rpx;">我已送达</view>
			</view>
			<view class="fix_detail_box" v-if="info.status=='GRABBED'">
				<view class="scroll_item_order_btn3" hover-class="hover_class" @click="handleCallStore(info.sender_phone)">
					<image src="https://www.cccshansong.com/chong_weapp/order_detail_icon1.png" mode=""></image><text>联系商家</text>
				</view>
				<view class="scroll_item_order_btn3" hover-class="hover_class" @click="handleChange(info.sender_phone)" style="margin-right:34rpx;">
					&lt;!&ndash; <image src="https://www.cccshansong.com/chong_weapp/order_detail_icon2.png" mode=""></image> &ndash;&gt;
					<image src="https://www.cccshansong.com/chong_weapp/order_detail_icon2_new1.png" mode=""></image>
					<text>转单</text>
				</view>
				<view class="scroll_item_order_btn5" hover-class="hover_class" @click.stop="handlePick()" style="width: 464rpx;background-color: rgba(255, 107, 0, 1);">我已到店</view>
			</view>
			<view class="fix_detail_box" v-if="info.status=='PICKUP'">
				<view class="scroll_item_order_btn3" hover-class="hover_class" @click="handleCallStore(info.sender_phone)">
					<image src="https://www.cccshansong.com/chong_weapp/order_detail_icon1.png" mode=""></image><text>联系商家</text>
				</view>
				<view class="scroll_item_order_btn3" hover-class="hover_class" @click="handleChange(info.sender_phone)" style="margin-right:34rpx;">
					&lt;!&ndash; <image src="https://www.cccshansong.com/chong_weapp/order_detail_icon2.png" mode=""></image> &ndash;&gt;
					<image src="https://www.cccshansong.com/chong_weapp/order_detail_icon2_new1.png" mode=""></image>
					<text>转单</text>
				</view>
				<view class="scroll_item_order_btn5" hover-class="hover_class" @click.stop="handleDelivery()" style="width: 464rpx;background-color: rgba(0, 117, 255, 1);">我已取货</view>
			</view>
			<view class="fix_detail_box" v-if="info.status=='PENDING'">
				<view class="scroll_item_order_btn5" hover-class="hover_class" @click.stop="handleRefuse()" style="width: 228rpx;background-color:rgba(255, 168, 0, 1);margin-right: 20rpx;">拒绝接单</view>
				<view class="scroll_item_order_btn5" hover-class="hover_class" @click.stop="handleGrab()" style="width: 454rpx;background-color:rgba(255, 107, 0, 1);">抢 单</view>
			</view>-->
			<view class="fix_detail_box_new" v-if="info.status=='DELIVERING'">
				<view class="li blue" style="width: calc(33.333% - 13rpx)" @click.stop="toChat()">
					<image src="../../static/images/icon48.png"></image>
					<text>聊天</text>
				</view>
				<view class="li blue" style="width: calc(33.333% - 13rpx)" @click="handleCallStore(info.sender_phone)">
					<image src="../../static/images/icon49.png"></image>
					<text>电话</text>
				</view>
				<view class="li blue" style="width: calc(33.333% - 13rpx)" @click.stop="handleGrabDone()">
					<text>我已送达</text>
				</view>
			</view>
			<view class="fix_detail_box_new" v-if="info.status=='GRABBED'">
				<view class="li blue" style="width: calc(25% - 13rpx)" @click.stop="toChat()">
					<image src="../../static/images/icon48.png"></image>
					<text>聊天</text>
				</view>
				<view class="li blue" style="width: calc(25% - 13rpx)" @click="handleCallStore(info.sender_phone)">
					<image src="../../static/images/icon49.png"></image>
					<text>电话</text>
				</view>
				<view class="li orange" style="width: calc(25% - 13rpx)" @click="handleChange(info.sender_phone)">
					<image src="../../static/images/icon50.png"></image>
					<text>转单</text>
				</view>
				<view class="li blue" style="width: calc(25% - 13rpx)" @click.stop="handlePick()">
					<text>我已到店</text>
				</view>
			</view>
			<view class="fix_detail_box_new" v-if="info.status=='PICKUP'">
				<view class="li blue" style="width: calc(25% - 13rpx)" @click.stop="toChat()">
					<image src="../../static/images/icon48.png"></image>
					<text>聊天</text>
				</view>
				<view class="li blue" style="width: calc(25% - 13rpx)" @click="handleCallStore(info.sender_phone)">
					<image src="../../static/images/icon49.png"></image>
					<text>电话</text>
				</view>
				<view class="li orange" style="width: calc(25% - 13rpx)" @click="handleChange(info.sender_phone)">
					<image src="../../static/images/icon50.png"></image>
					<text>转单</text>
				</view>
				<view class="li blue" style="width: calc(25% - 13rpx)" @click.stop="handleDelivery()">
					<text>我已取货</text>
				</view>
			</view>
			<view class="fix_detail_box_new" v-if="info.status=='PENDING'">
				<view class="li blue" style="width: 100%" @click.stop="handleGrab()">
					<text>抢单</text>
				</view>
			</view>
			<!--<view class="fix_detail_box_new">
				<view class="li red">
					<text>取消订单</text>
				</view>
				<view class="li blue" @click.stop="toChat()">
					<image src="../../static/images/icon48.png"></image>
					<text>聊天</text>
				</view>
				<view class="li blue">
					<image src="../../static/images/icon49.png"></image>
					<text>电话</text>
				</view>
				<view class="li blue">
					<image src="../../static/images/icon50.png"></image>
					<text>转单</text>
				</view>
			</view>-->
			<wyb-popup ref="kfPopup" type="bottom" height="364" width='640' radius="16" :maskAlpha='0' :zIndex='999999'  :showCloseIcon="false"    >
				<view class="kfPopup_content">
					<view class="kf_btn_title">提示</view>
					<view class="kf_btn_title1">请任意选择一种方式联系客服</view>
					<view class="kf_btn_box">
						<view class="kf_btn1" @click="handleKfCall()">拨打电话</view>
						<view class="kf_btn2" @click="handleKfWx()">微信客服</view>
					</view>
				</view>
			</wyb-popup>
			<wyb-popup ref="daodianPopup" type="bottom" height="544" width='640' :maskAlpha='0' radius="16" :zIndex='999999'  :maskClickClose="false" :showCloseIcon="false">
				<view class="xiuxi_popup_bj">
					<view style="height: 60rpx;"></view>
					<view class="xiuxi_popup_tip_text" style="padding-left: 30rpx;text-align: left;">
						确认已到店?
					</view>
					<view class="ask_img_box">
						<view class="ask_title">上传到店图片（选填）</view>
						<view class="img_list">
							<htz-image-upload  :max="3"  v-model="ceshiData" @imgDelete='imgDelete' @uploadSuccess="ceshiUploadSuccess" :action="action_url" ></htz-image-upload>
						</view>
					</view>
				</view>
				<view class="pay_popup_box" style="margin-top: 18rpx;">
					<view class="pay_popup_btn" hover-class="hover_class" @click="handlePickHide()">取消</view>
					<view class="pay_popup_btn1" hover-class="hover_class" @click="handlePickConfrim()">确认到店</view>
				</view>
			</wyb-popup>
			<wyb-popup ref="quhuoPopup" type="bottom" height="544" width='640' :maskAlpha='0' radius="16" :zIndex='999999'  :maskClickClose="false" :showCloseIcon="false">
				<view class="xiuxi_popup_bj">
					<view style="height: 60rpx;"></view>
					<view class="xiuxi_popup_tip_text" style="padding-left: 30rpx;text-align: left;">
						确认已取货?
					</view>
					<view class="ask_img_box">
						<view class="ask_title">上传取货图片（选填）</view>
						<view class="img_list">
							<htz-image-upload  :max="3"  v-model="ceshiData1" @imgDelete='imgDelete1' @uploadSuccess="ceshiUploadSuccess1" :action="action_url" ></htz-image-upload>
						</view>
					</view>
				</view>
				<view class="pay_popup_box" style="margin-top: 18rpx;">
					<view class="pay_popup_btn" hover-class="hover_class" @click="handleDeliveryHide()">取消</view>
					<view class="pay_popup_btn1" hover-class="hover_class" @click="handleDeliveryConfrim()">确认取货</view>
				</view>
			</wyb-popup>
			<wyb-popup ref="songdaPopup" type="bottom" height="544" width='640' :maskAlpha='0' radius="16" :zIndex='999999'  :maskClickClose="false" :showCloseIcon="false">
				<view class="xiuxi_popup_bj">
					<view style="height: 60rpx;"></view>
					<view class="xiuxi_popup_tip_text" style="padding-left: 30rpx;text-align: left;">
						确认已送达?
					</view>
					<view class="ask_img_box">
						<view class="ask_title">上传送达图片（选填）</view>
						<view class="img_list">
							<htz-image-upload  :max="3"  v-model="ceshiData2" @imgDelete='imgDelete2' @uploadSuccess="ceshiUploadSuccess2" :action="action_url" ></htz-image-upload>
						</view>
					</view>
				</view>
				<view class="pay_popup_box" style="margin-top: 18rpx;">
					<view class="pay_popup_btn" hover-class="hover_class" @click="handleGrabDoneHide()">取消</view>
					<view class="pay_popup_btn1" hover-class="hover_class" @click="handleGrabDoneConfrim()">确认送达</view>
				</view>
			</wyb-popup>
			<wyb-popup ref="phonePopup" type="bottom" height="452" width='750' :maskAlpha='0' radius="16"  :zIndex='999999'  :maskClickClose='true' :showCloseIcon="true" >
				<view class="popup_content_title">
					联系顾客
				</view>
				<view class="phone_popup_item_box" @click="handleCallStore(info.receiver_phone)">
					<image src="https://www.cccshansong.com/chong_weapp/order_detail_icon1.png" mode=""></image>
					<text>打电话给顾客</text>
				</view>
				<view class="phone_popup_item_box" @click="handleSms(info.receiver_phone)">
					<image src="https://www.cccshansong.com/chong_weapp/sms.png" mode=""></image>
					<text>发短信给顾客</text>
				</view>
			</wyb-popup>
			<wyb-popup ref="qiangPopup" type="bottom" height="452" width='640' radius="16" :maskAlpha='0'  :zIndex='999999'  :maskClickClose='false' :showCloseIcon="false" >
				<view class="xiuxi_popup_bj">
					<view style="height: 74rpx;"></view>
					<view class="custom_service_order_reckon_box">
						<image class="rotate-image" src="https://www.cccshansong.com/chong_weapp/daojishi.png" mode=""></image>
						<view class="custom_service_order_reckon_info_box">{{countdown}}</view>
					</view>
					<view class="xiuxi_popup_tip_text" style="margin-top: 30rpx;">抢单中</view>
				</view>
				<view class="qiang_ucc_popup_tip">正在为您抢单，请稍后...</view>
			</wyb-popup>
			<wyb-popup ref="qiangFailPopup" type="bottom" height="572" width='640' :maskAlpha='0' radius="16" :zIndex='999999'  :showCloseIcon="false" >
				<view class="xiuxi_popup_bj">
					<view style="height: 74rpx;"></view>
					<view class="xiuxi_popup_tip_img" style="width: 144rpx;height: 144rpx;">
						<image
							src="https://www.cccshansong.com/chong_weapp/qiang_fail.png"
							mode="">
					</view>
					<view class="xiuxi_popup_tip_text" style="margin-top: 30rpx;">抢单失败</view>
				</view>
				<view class="qiang_ucc_popup_tip">抢单失败，还是来晚一步...</view>
				<view class="qiang_fail_btn" @click="handleHideFailPopup()">继续抢单</view>
			</wyb-popup>
			<wyb-popup ref="qiangFailPopupTip" type="bottom" height="572" width='640' :maskAlpha='0' radius="16" :zIndex='999999'  :showCloseIcon="false" >
				<view class="xiuxi_popup_bj">
					<view style="height: 74rpx;"></view>
					<view class="xiuxi_popup_tip_img" style="width: 144rpx;height: 144rpx;">
						<image
							src="https://www.cccshansong.com/chong_weapp/qiang_fail.png"
							mode="">
					</view>
					<view class="xiuxi_popup_tip_text" style="margin-top: 30rpx;">抢单失败</view>
				</view>
				<view class="qiang_ucc_popup_tip">{{errorMsg}}</view>
				<view class="qiang_fail_btn" @click="handleHideFailPopup()">继续抢单</view>
			</wyb-popup>
			<wyb-popup ref="qiangMaxPopup" type="bottom" height="572" width='640' :maskAlpha='0' radius="16" :zIndex='999999'  :showCloseIcon="false">
				<view class="xiuxi_popup_bj">
					<view style="height: 74rpx;"></view>
					<view class="xiuxi_popup_tip_img" style="width: 144rpx;height: 144rpx;">
						<image src="https://www.cccshansong.com/chong_weapp/qiang_fail.png"
							mode="">
					</view>
					<view class="xiuxi_popup_tip_text" style="margin-top: 30rpx;">抢单失败</view>
				</view>
				<view class="qiang_ucc_popup_tip">{{max_count_tip}}</view>
				<view class="qiang_fail_btn" @click="handleHideMaxPopup()">我知道了</view>
			</wyb-popup>
			<wyb-popup ref="oneToOnePopup" type="bottom" height="572" width='640' :maskAlpha='0' radius="16" :zIndex='999999'  :showCloseIcon="false">
				<view class="xiuxi_popup_bj">
					<view style="height: 74rpx;"></view>
					<view class="xiuxi_popup_tip_img" style="width: 144rpx;height: 144rpx;">
						<image src="https://www.cccshansong.com/chong_weapp/qiang_fail.png"
							mode="">
					</view>
					<view class="xiuxi_popup_tip_text" style="margin-top: 30rpx;">抢单失败</view>
				</view>
				<view class="qiang_ucc_popup_tip">{{onetoone_count_tip}}</view>
				<view class="qiang_fail_btn" @click="handleHideOneToOnePopup()">我知道了</view>
			</wyb-popup>
		</view>
		<yk-authpup ref="authpupLocation" type="top" :isNativeHead='true' @changeAuth="changeAuthLocation" :permissionID="permissionID"></yk-authpup>
		<yk-authpup ref="authpup" :isNativeHead='true' type="top" @changeAuth="changeAuth" :permissionID="permissionID"></yk-authpup>
		<yk-authpup ref="authpupPhone" :isNativeHead='true' type="top" @changeAuth="changeAuthPhone" :permissionID="permissionID"></yk-authpup>

		<yk-authpup ref="authpupCamera" type="top" :isNativeHead='true' @changeAuth="changeAuthCamera" :permissionID="permissionID"></yk-authpup>
		<yk-authpup ref="authpupAlbum" type="top" :isNativeHead='true' @changeAuth="changeAuthAlbum" :permissionID="permissionID"></yk-authpup>
		<yk-authpup ref="authpupCamera1" type="top" :isNativeHead='true' @changeAuth="changeAuthCamera1" :permissionID="permissionID"></yk-authpup>
		<yk-authpup ref="authpupAlbum1" type="top" :isNativeHead='true' @changeAuth="changeAuthAlbum1" :permissionID="permissionID"></yk-authpup>
		<yk-authpup ref="authpupCamera2" type="top" :isNativeHead='true' @changeAuth="changeAuthCamera2" :permissionID="permissionID"></yk-authpup>
		<yk-authpup ref="authpupAlbum2" type="top" :isNativeHead='true' @changeAuth="changeAuthAlbum2" :permissionID="permissionID"></yk-authpup>
		<yk-authpup ref="authpupPhoneKf" :isNativeHead='true' type="top" @changeAuth="changeAuthPhoneKf" :permissionID="permissionID"></yk-authpup>
	</view>
</template>
<!-- status PENDING 待接单  GRABBED 待到店    PICKUP待取货   DELIVERING 配送中  DONE 完成    CANCEL 取消   RIDER_CANCEL 骑手取消 -->
<script>
	import htzImageUpload from '@/components/htz-image-upload/htz-image-upload1.vue'
	import zeroLoading from "@/components/zero-loading/components/zero-loading/zero-loading.vue"
	import navigationCustom from "@/components/struggler-navigationCustom/navigation-custom.vue"
	import wybPopup from '@/components/wyb-popup/wyb-popup.vue';
	import ykAuthpup from "@/components/yk-authpup/yk-authpup";
	export default {
		components: {
			htzImageUpload,
			wybPopup,
			navigationCustom,
			zeroLoading,
			ykAuthpup
		},
		data() {
			return {
				permissionID:'',
				user_status: 0, //1上线  0休息
				confrim_btn_status:true,
				action_url:'',
				image_arr:[],
				ceshiData:[],
				image_arr1:[],
				ceshiData1:[],
				image_arr2:[],
				ceshiData2:[],
				countdown: 0,
				timer: null,
				covers: [], //存放标记点数组
				location_address: '',
				distance: '',
				cost: '',
				polyline: [],
				scale: 13,
				latitude: 35.106909,
				longitude:  118.355317,
				currentHeight: 0, // 滑动组件当前高度
				scrollViewHeight: 0, //用于计算滚动区域高度
				map: null,
				// 屏幕高度
				screenHeight: 667,
				statusHeight: 0,
				config: {
					title: "", //title
					bgcolor: "transparent", //背景颜色
					fontcolor: "#303133", //文字颜色，默认白色
					type: 4, //type 1，3胶囊 2，4无胶囊模式
					transparent: false, //是否背景透明 默认白色
					linear: false, //是为开启下滑渐变
					share: false, //是否将主页按钮显示为分享按钮
					menuIcon: "../../static/icon/back3.png", //当type为3或者4的时候左边的icon文件位置，注意位置与当前页面不一样
					// menuText:"返回", //当type为3或4的时候icon右边的文字
				},
				navTabtop: 20,


				mapMarkers: [{
					id: 123132,
					longitude: 121.373219,
					latitude: 31.23378,
					iconPath: 'https://www.cccshansong.com/chong_weapp/map_qu_icon1.png',
					width: 40,
					height: 40
				}],
				// page
				windowHeight: 800,
				mapHeight: 250,
				cHeightNum: 0,
				movableHeight: 800,
				canDragTop: 0,
				initY: 0,
				dragY: 0,
				drageIco: 'down',
				id:0,
				info:null,
				btn_status:true,
				kf_phone:'',
				max_count_tip:'',
				onetoone_count_tip:'',
				user_latitude:'',
				user_longitude:'',
				map_latitude:'',
				map_longitude:'',
				refresh_status:true,
				grab_btn_status:true,
				is_opacity:false,
				select_store_phone:'',
				errorMsg:''
			};
		},
		onLoad(e) {


			this.windowHeight = uni.getSystemInfoSync().windowHeight

			this.mapHeight = this.windowHeight - 240;
			this.movableHeight = this.windowHeight - 250
			console.log(this.movableHeight)
			this.cHeightNum = this.windowHeight - 240
			this.initY = -(this.windowHeight - 250 - 240);
			this.canDragTop = -(this.windowHeight - 250 - 240)

			this.dragY = 0
			var a = this
			a.statusHeight = uni.getSystemInfoSync().statusBarHeight  + 15
			a.action_url = a.globalurl + 'common/image_upload'

			a.id = e.id
			a.getDetail()
			a.getConfig()
			a.getUserInfo()
		},
		onShow() {
			var a = this
			// a.getDetail()
		},
		onHide() {
			var a = this
			uni.stopLocationUpdate({
				success:res2=>{
					console.log('停止')
				}
			})
			uni.offLocationChange(function(res){
				console.log('关闭')
			})
		},
		onUnload() {
			var a = this
			uni.stopLocationUpdate({
				success:res2=>{
					console.log('停止')
				}
			})
			uni.offLocationChange(function(res){
				console.log('关闭')
			})
		},
		methods: {
			toChat(){
				uni.navigateTo({
					url:`/pages/chat/detail?id=${this.info.merchant.consumer_id}`
				})
			},
			imgDelete(e){
				this.image_arr.splice(e.index, 1)
			},
			ceshiUploadSuccess(res) { //上传成功
				var _res = JSON.parse(res.data);
				console.log(_res)
				this.image_arr.push(_res.data.complete_url);
				this.ceshiData.push(_res.data.complete_url);
			},
			imgDelete1(e){
				this.image_arr1.splice(e.index, 1)
			},
			ceshiUploadSuccess1(res) { //上传成功
				var _res = JSON.parse(res.data);
				console.log(_res)
				this.image_arr1.push(_res.data.complete_url);
				this.ceshiData1.push(_res.data.complete_url);
			},
			imgDelete2(e){
				this.image_arr2.splice(e.index, 1)
			},
			ceshiUploadSuccess2(res) { //上传成功
				var _res = JSON.parse(res.data);
				console.log(_res)
				this.image_arr2.push(_res.data.complete_url);
				this.ceshiData2.push(_res.data.complete_url);
			},
			handleChange(){
				var a = this
				uni.showModal({
				    title: '提示',
				    content: '确认要转单吗',
				    confirmText: "确认",
					cancelText:"取消",
					confirmColor:'#FF6B00',
				    success(res) {
				      if (res.confirm) {
						uni.showLoading({
							title:'加载中'
						})
						a.globalajax('order/changeOrderRider',{
							id:a.id
							},'GET',function(res) {
								console.log(res);
								uni.hideLoading()
								uni.stopPullDownRefresh()
								if(res.data.code==200){
									uni.showToast({
										title:'操作成功',
										icon:'none'
									})
									a.onPlayAudio(4)
									setTimeout(() => {
										uni.navigateBack()
									}, 300)
								}else{
									a.onPlayAudio(5)
									a.$showModal({
										title:'友情提示',
										content:res.data.msg,
										showCancel:false,
										confirmText:'我知道了',
										success: (res) => {
										}
									});
								}
							}
						);
				      }
				    }
				});
			},
			goArticle(){
				uni.navigateTo({
					url:'/pages/user/articleDetail?id=4'
				})
			},
			onPlayAudio(index) {
				var type = index
				var audio_src = '';

				if (type == 1) {
					audio_src =
						'https://www.cccshansong.com/chong_weapp/music/xindingdan_new1_new1.mp3'; //新订单
				} else if (type == 2) {
					audio_src =
						'https://www.cccshansong.com/chong_weapp/music/tuikuan_new1_new1.mp3'; //退款取消
				} else if (type == 3) {
					audio_src =
						'https://www.cccshansong.com/chong_weapp/music/paidan_new1_new1.mp3'; //派单
				} else if (type == 4) {
					audio_src =
						'https://www.cccshansong.com/chong_weapp/music/zhuan_succ_new11.mp3'; //转单成功
				} else if (type == 5) {
					audio_src =
						'https://www.cccshansong.com/chong_weapp/music/zhuan_fail_new11.mp3'; //转单失败
				} else if (type == 6) {
					audio_src =
						'https://www.cccshansong.com/chong_weapp/music/shangxian_new_new1.mp3'; //上线
				} else if (type == 7) {
					audio_src =
						'https://www.cccshansong.com/chong_weapp/music/xiuxi_new1_new1.mp3'; //下线
				} else if (type == 8) {
					audio_src =
						'https://www.cccshansong.com/chong_weapp/music/qiang_succ_new.mp3'; //抢单成功
				} else if (type == 9) {
					audio_src =
						'https://www.cccshansong.com/chong_weapp/music/qiang_fail_new5.mp3'; //抢单失败
				} else if (type ==10) {
					audio_src =
						'https://www.cccshansong.com/chong_weapp/music/max_count.mp3'; //到达最大接单数量
				} else if (type ==11) {
					audio_src =
						'https://www.cccshansong.com/chong_weapp/music/daodian1.mp3'; //已到店
				} else if (type ==12) {
					audio_src =
						'https://www.cccshansong.com/chong_weapp/music/quhuo1.mp3'; //已取货
				} else if (type ==13) {
					audio_src =
						'https://www.cccshansong.com/chong_weapp/music/chaoshi1.mp3'; //快超时
				} else if (type ==14) {
					audio_src =
						'https://www.cccshansong.com/chong_weapp/music/songda1.mp3'; //已送达
				}

				var music = null;
				music = uni.createInnerAudioContext(); //创建播放器对象
				music.src = audio_src; //这里引入自己生成的mp3音频文件地址
				music.play(); //执行播放
				music.onEnded(() => {
					//播放结束
					music = null;
				});


			},
			getConfig(){
				var a =this
				a.globalajax('common/getConfig',{
					value:'mobile'
					},'GET',function(res) {
						console.log(res);
						uni.hideLoading()
						uni.stopPullDownRefresh()
						if(res.data.code==200){
							a.kf_phone = res.data.data
						}else{
							a.$showModal({
								title:'友情提示',
								content:res.data.msg,
								showCancel:false,
								confirmText:'我知道了',
								success: (res) => {
								}
							});
						}
					}
				);
			},
			getUserInfo() {
				var a = this
				a.globalajax('user/info', {}, 'GET', function(res) {
					console.log(res);
					uni.hideLoading()
					uni.stopPullDownRefresh()
					if (res.data.code == 200) {
						if(res.data.data.info.status==0){
							// 账号被拉黑   清除token
							 uni.clearStorageSync()
							 uni.reLaunch({
							   url: '/pages/index/login'
							 })
						}else{
							a.user_status = res.data.data.info.is_work
						}
					} else {
						a.$showModal({
							title:'友情提示',
							content:res.data.msg,
							showCancel:false,
							confirmText:'我知道了',
							success: (res) => {
							}
						});
					}
				});
			},
			handleHideMaxPopup(){
				var a = this
				a.$refs.qiangMaxPopup.hide();
				a.is_opacity = false
			},
			handleHideOneToOnePopup(){
				var a = this
				a.$refs.oneToOnePopup.hide();
				a.is_opacity = false
			},
			handleGrab(){
				var a = this
				if(a.user_status!=1){
					uni.showToast({
						title:'请先上线',
						icon:'none'
					})
				}else{
					if(a.grab_btn_status){
						uni.showLoading({
							title:'抢单中'
						})
						a.grab_btn_status = false
						a.globalajax('order/grabOrders',{
							id:a.id,
						},'GET',function(res) {
								console.log(res);
								uni.hideLoading()
								setTimeout(()=>{
									a.grab_btn_status = true
								},1500)
								if(res.data.code==200){
									if(res.data.data==0){
										a.onPlayAudio(9)
										a.errorMsg = res.data.msg;
										a.$refs.qiangFailPopupTip.show();
										/*setTimeout(()=>{
											uni.navigateBack()
										},200)*/
									}else if(res.data.data==1){
										setTimeout(()=>{
											a.getDetail()
										},200)
										a.onPlayAudio(8)
										uni.showToast({
											title:'抢单成功',
											icon:'none'
										})
									}else if (res.data.data == 2) {
										// 已到最大接单数量
										a.max_count_tip = res.data.msg
										setTimeout(() => {
											a.$refs.qiangMaxPopup.show();
											a.is_opacity = true
										}, 200)
										a.onPlayAudio(10)
									}else if (res.data.data == 3) {
										//抢一对一的订单和其他订单冲突
										a.onetoone_count_tip = '一对一订单需当前没有正在进行中订单，才可以抢单!'
										setTimeout(() => {
											a.is_opacity = true
											a.$refs.oneToOnePopup.show();
										}, 200)
										a.onPlayAudio(9)
									}
								}else{
									a.showError(res.data.msg);
								}
							}
						);
					}


					// a.$refs.qiangPopup.show();
					// this.countdown = 3;
					// this.timer = setInterval(() => {
					// 	if (this.countdown > 1) {
					// 		this.countdown--;
					// 	} else {
					// 		clearInterval(this.timer); // 清除定时器
					// 		a.globalajax('order/grabOrders',{
					// 			id:a.id,
					// 		},'GET',function(res) {
					// 				console.log(res);
					// 				uni.hideLoading()
					// 				a.$refs.qiangPopup.hide();
					// 				if(res.data.code==200){
					// 					if(res.data.data==0){
					// 						a.onPlayAudio(9)
					// 						setTimeout(()=>{
					// 							uni.navigateBack()
					// 						},200)
					// 					}else if(res.data.data==1){
					// 						setTimeout(()=>{
					// 							a.getDetail()
					// 						},200)
					// 						a.onPlayAudio(8)
					// 						uni.showToast({
					// 							title:'抢单成功',
					// 							icon:'none'
					// 						})
					// 					}else if (res.data.data == 2) {
					// 						// 已到最大接单数量
					// 						a.max_count_tip = res.data.msg
					// 						setTimeout(() => {
					// 							a.$refs.qiangMaxPopup.show();
					// 						}, 200)
					// 						a.onPlayAudio(10)
					// 					}
					// 				}else{
					// 					a.$showModal({
					// 						title:'友情提示',
					// 						content:res.data.msg,
					// 						showCancel:false,
					// 						confirmText:'我知道了',
					// 						success: (res) => {
					// 						}
					// 					});
					// 				}
					// 			}
					// 		);
					// 	}
					// }, 1000);
				}
			},
			handleRefuse(){
				var a = this
				if(a.btn_status){
					a.btn_status = false
					uni.showLoading({
						title:'加载中'
					})
					a.globalajax('order/OrderRefuse',{
						id:a.id
						},'GET',function(res) {
							console.log(res);
							uni.hideLoading()
							uni.stopPullDownRefresh()
							setTimeout(()=>{
								a.btn_status = true
							},1500)
							if(res.data.code==200){
								uni.showToast({
									title:'操作成功',
									icon:'none'
								})
								setTimeout(()=>{
									uni.navigateBack()
								},200)
							}else{
								a.$showModal({
									title:'友情提示',
									content:res.data.msg,
									showCancel:false,
									confirmText:'我知道了',
									success: (res) => {
									}
								});
							}
						}
					);
				}
			},
			handleCustomer(){
				var a = this
				a.$refs.phonePopup.show();
				a.is_opacity = true
			},
			handleDeliveryHide(){
				var a = this
				a.$refs.quhuoPopup.hide();
				a.is_opacity = false
				a.image_arr1 = []
				a.ceshiData1 = []
			},
			handleDeliveryConfrim(){
				var a = this
				if(a.confrim_btn_status){
					var temp_str = ''
					if(a.image_arr1.length>0){
						temp_str = JSON.stringify(a.image_arr1)
					}
					a.confrim_btn_status = false
					uni.showLoading({
						title: '加载中'
					})
					a.globalajax('order/deliveryOrder', {
						id: a.id,
						delivery_image:temp_str
					}, 'GET', function(res) {
						console.log(res);
						uni.hideLoading()
						uni.stopPullDownRefresh()
						a.$refs.quhuoPopup.hide();
						a.is_opacity = false
						setTimeout(()=>{
							a.confrim_btn_status = true
						},1500)
						if (res.data.code == 200) {
							a.image_arr1 = []
							a.ceshiData1 = []
							a.onPlayAudio(12)
							uni.showToast({
								title: '操作成功',
								icon: 'none'
							})
							setTimeout(() => {
								a.getDetail()
							}, 300)
						} else {
							a.$showModal({
								title:'友情提示',
								content:res.data.msg,
								showCancel:false,
								confirmText:'我知道了',
								success: (res) => {
								}
							});
						}
					});
				}
			},
			handleDelivery(){
				var a = this
				a.is_opacity = true
				a.openAuthCamera1('CAMERA')
			},
			//打开自定义权限目的弹框
			openAuthCamera1(permissionID){
				this.permissionID = permissionID;//这个是对应的权限 ACCESS_FINE_LOCATION 位置权限 / WRITE_EXTERNAL_STORAGE 存储空间/照片权限 / CAMERA相机权限 / CALL_PHONE 拨打电话
				setTimeout(()=>{
					this.$refs['authpupCamera1'].open();
				},200)
				var a = this
				setTimeout(()=>{
					a.is_opacity = false
				},6000)
			},
			openAuthAlbum1(permissionID){
				this.permissionID = permissionID;//这个是对应的权限 ACCESS_FINE_LOCATION 位置权限 / WRITE_EXTERNAL_STORAGE 存储空间/照片权限 / CAMERA相机权限 / CALL_PHONE 拨打电话
				setTimeout(()=>{
					this.$refs['authpupAlbum1'].open();
				},200)
				var a = this
				setTimeout(()=>{
					a.is_opacity = false
				},6000)
			},
			//用户授权权限后的回调
			changeAuthCamera1(){
				//这里是权限通过后执行自己的代码逻辑
				console.log('拍照权限已授权，可执行自己的代码逻辑了');
				this.openAuthAlbum1('WRITE_EXTERNAL_STORAGE')
				this.is_opacity = true
			},
			changeAuthAlbum1(){
				//这里是权限通过后执行自己的代码逻辑
				console.log('相册权限已授权，可执行自己的代码逻辑了');
				this.$refs.quhuoPopup.show();
				this.is_opacity = true
			},
			handlePickHide(){
				var a = this
				a.$refs.daodianPopup.hide();
				a.is_opacity = false
				a.image_arr = []
				a.ceshiData = []
			},
			handlePreview(index,arr){
				uni.previewImage({
					current: index,
					urls: arr,
					loop: true,
					longPressActions: true
				})
			},
			handlePickConfrim(){
				var a = this
				if(a.confrim_btn_status){
					var temp_str = ''
					if(a.image_arr.length>0){
						temp_str = JSON.stringify(a.image_arr)
					}
					a.confrim_btn_status = false
					uni.showLoading({
						title: '加载中'
					})
					a.globalajax('order/pickOrder', {
						id: a.id,
						pick_image:temp_str
					}, 'GET', function(res) {
						console.log(res);
						uni.hideLoading()
						uni.stopPullDownRefresh()
						a.$refs.daodianPopup.hide();
						a.is_opacity = false
						setTimeout(()=>{
							a.confrim_btn_status = true
						},1500)
						if (res.data.code == 200) {
							a.image_arr = []
							a.ceshiData = []
							a.onPlayAudio(11)
							uni.showToast({
								title: '操作成功',
								icon: 'none'
							})
							setTimeout(() => {
								a.getDetail()
							}, 300)
						} else {
							a.$showModal({
								title:'友情提示',
								content:res.data.msg,
								showCancel:false,
								confirmText:'我知道了',
								success: (res) => {
								}
							});
						}
					});
				}
			},
			handlePick(){
				var a = this
				a.openAuthCamera('CAMERA')
			},
			//打开自定义权限目的弹框
			openAuthCamera(permissionID){
				this.is_opacity = true
				this.permissionID = permissionID;//这个是对应的权限 ACCESS_FINE_LOCATION 位置权限 / WRITE_EXTERNAL_STORAGE 存储空间/照片权限 / CAMERA相机权限 / CALL_PHONE 拨打电话
				setTimeout(()=>{
					this.$refs['authpupCamera'].open();
				},200)
				var a = this
				setTimeout(()=>{
					a.is_opacity = false
				},3000)
			},
			openAuthAlbum(permissionID){
				this.is_opacity = true
				this.permissionID = permissionID;//这个是对应的权限 ACCESS_FINE_LOCATION 位置权限 / WRITE_EXTERNAL_STORAGE 存储空间/照片权限 / CAMERA相机权限 / CALL_PHONE 拨打电话
				setTimeout(()=>{
					this.$refs['authpupAlbum'].open();
				},200)
				var a = this
				setTimeout(()=>{
					a.is_opacity = false
				},3000)
			},
			//用户授权权限后的回调
			changeAuthCamera(){
				//这里是权限通过后执行自己的代码逻辑
				console.log('拍照权限已授权，可执行自己的代码逻辑了');
				this.openAuthAlbum('WRITE_EXTERNAL_STORAGE')
			},
			changeAuthAlbum(){
				//这里是权限通过后执行自己的代码逻辑
				console.log('相册权限已授权，可执行自己的代码逻辑了');
				this.$refs.daodianPopup.show();
				this.is_opacity = true

			},
			handleGrabDoneHide(){
				var a = this
				a.$refs.songdaPopup.hide();
				a.is_opacity = false
				a.image_arr2 = []
				a.ceshiData2 = []
			},
			handleGrabDoneConfrim(){
				var a = this
				if(a.confrim_btn_status){
					var temp_str = ''
					if(a.image_arr2.length>0){
						temp_str = JSON.stringify(a.image_arr2)
					}
					a.confrim_btn_status = false
					uni.showLoading({
						title: '加载中'
					})
					a.globalajax('order/done', {
						id:a.id,
						image:temp_str
					}, 'GET', function(res) {
						console.log(res);
						uni.hideLoading()
						uni.stopPullDownRefresh()
						a.$refs.songdaPopup.hide();
						a.is_opacity = false
						setTimeout(()=>{
							a.confrim_btn_status = true
						},1500)
						if (res.data.code == 200) {
							a.image_arr2 = []
							a.ceshiData2 = []
							a.onPlayAudio(14)
							uni.showToast({
								title: '操作成功',
								icon: 'none'
							})
							setTimeout(() => {
								a.getDetail()
							}, 300)
						} else {
							a.$showModal({
								title:'友情提示',
								content:res.data.msg,
								showCancel:false,
								confirmText:'我知道了',
								success: (res) => {
								}
							});
						}
					});
				}
			},
			handleGrabDone(){
				var a =this
				a.is_opacity = true
				a.openAuthCamera2('CAMERA')
			},
			//打开自定义权限目的弹框
			openAuthCamera2(permissionID){
				this.permissionID = permissionID;//这个是对应的权限 ACCESS_FINE_LOCATION 位置权限 / WRITE_EXTERNAL_STORAGE 存储空间/照片权限 / CAMERA相机权限 / CALL_PHONE 拨打电话
				setTimeout(()=>{
					this.$refs['authpupCamera2'].open();
				},200)
				var a = this
				setTimeout(()=>{
					a.is_opacity = false
				},6000)
			},
			openAuthAlbum2(permissionID){
				this.permissionID = permissionID;//这个是对应的权限 ACCESS_FINE_LOCATION 位置权限 / WRITE_EXTERNAL_STORAGE 存储空间/照片权限 / CAMERA相机权限 / CALL_PHONE 拨打电话
				setTimeout(()=>{
					this.$refs['authpupAlbum2'].open();
				},200)
				var a = this
				setTimeout(()=>{
					a.is_opacity = false
				},6000)
			},
			//用户授权权限后的回调
			changeAuthCamera2(){
				//这里是权限通过后执行自己的代码逻辑
				console.log('拍照权限已授权，可执行自己的代码逻辑了');
				this.openAuthAlbum2('WRITE_EXTERNAL_STORAGE')
				this.is_opacity = true
			},
			changeAuthAlbum2(){
				//这里是权限通过后执行自己的代码逻辑
				console.log('相册权限已授权，可执行自己的代码逻辑了');
				this.$refs.songdaPopup.show();
				this.is_opacity = true
			},
			handleCopy(num){
				uni.setClipboardData({
				    data: num,
				    success: function() {
				        uni.showToast({
				            title: '复制成功',
				            icon: 'none'
				        });
				    },
				    fail: function() {
				        uni.showToast({
				            title: '复制失败',
				            icon: 'none'
				        });
				    }
				});
			},
			handleMap(address,address_text){
				console.log(address)
				// uni.openLocation({
				// 	latitude: address.lat*1,
				// 	longitude: address.lng*1,
				// 	name:'位置',
				// 	address:address_text,
				// 	success: function (res) {
				// 	},
				// 	fail(res) {
				// 		console.log(res);
				// 	}
				// });


				if (plus.runtime.isApplicationExist({ pname: 'com.autonavi.minimap', action: 'iosamap://' })) {
					let url = `amapuri://route/plan?sourceApplication=yourAppName&dlat=${Number(address.lat)}&dlon=${Number(address.lng)}&dev=0&t=3&style=0&start=&auto=1&rtdType=1&dname=${address_text}`;
					plus.runtime.openURL(url);
				}  else {
					uni.showToast({
						title: '当前未安装 高德地图 无法导航',
						icon: 'none',
						duration: 3000
					});
				}
			},
			handleCallStore(phone){
				var a = this
				this.$refs.phonePopup.hide();
				a.is_opacity = true
				a.openAuthPhone('CALL_PHONE')
				if (phone.includes('_')) {
				    phone = phone.split('_')[0] + ',' + phone.split('_')[1]; // 使用 split 方法
				}
				a.select_store_phone = phone
				console.log('phonephonephonephone',phone)
			},
			//打开自定义权限目的弹框
			openAuthPhone(permissionID){
				this.permissionID = permissionID;//这个是对应的权限 ACCESS_FINE_LOCATION 位置权限 / WRITE_EXTERNAL_STORAGE 存储空间/照片权限 / CAMERA相机权限 / CALL_PHONE 拨打电话
				setTimeout(()=>{
					this.$refs['authpupPhone'].open();
				},200)
				var a = this
				setTimeout(()=>{
					a.is_opacity = false
				},4000)
			},
			changeAuthPhone(){
				var a = this
				//这里是权限通过后执行自己的代码逻辑
				console.log('拨打电话权限已授权，可执行自己的代码逻辑了');
				var temp_str = '呼叫'+ a.select_store_phone
				uni.showActionSheet({
					itemList: [temp_str],
					success: function(res) {
						console.log(res);
						if (res.tapIndex == 0) {
							uni.makePhoneCall({
								phoneNumber: a.select_store_phone,
								success: (res) => {
									console.log('调用成功!')
								},
							})
						}
					}
				})
			},
			handleSms(phone){
				var a = this
				a.$refs.phonePopup.hide();
				a.is_opacity = false
				//#ifdef APP-PLUS
				    plus.messaging.TYPE_SMS;
				    var msg = plus.messaging.createMessage(plus.messaging.TYPE_SMS);
				    msg.to = [phone];
				    msg.body = '';
				    plus.messaging.sendMessage(msg);
				// #endif

			},
			getDetail(){
				var a =this
				uni.showLoading({
					title:'加载中'
				})
				a.globalajax('order/orderInfo',{
					id:a.id
					},'GET',function(res) {
						console.log(res);
						uni.hideLoading()
						uni.stopPullDownRefresh()
						if(res.data.code==200){
							var temp_obj = res.data.data
							temp_obj.price_complete = JSON.parse(temp_obj.price)
							temp_obj.receiver_address_detail_complete = JSON.parse(temp_obj.receiver_address_detail)
							temp_obj.sender_address_detail_complete = JSON.parse(temp_obj.sender_address_detail)
							if(temp_obj.pick_image!=null){
								temp_obj.pick_image_complete = JSON.parse(temp_obj.pick_image)
							}
							if(temp_obj.delivery_image!=null){
								temp_obj.delivery_image_complete = JSON.parse(temp_obj.delivery_image)
							}
							if(temp_obj.image!=null){
								temp_obj.image_complete = JSON.parse(temp_obj.image)
							}
							a.info = temp_obj
							a.covers = []
							a.polyline = []
							console.log('-**-*-*')
							a.setCovers(temp_obj.sender_address_detail_complete,temp_obj.receiver_address_detail_complete)
							a.getRide(temp_obj.sender_address_detail_complete,temp_obj.receiver_address_detail_complete)
							a.latitude = temp_obj.sender_address_detail_complete.lat;
							a.longitude = temp_obj.sender_address_detail_complete.lng;
							a.openAuthLocation('ACCESS_FINE_LOCATION')  //定位权限
							// a.getLocation()

						}else{
							a.$showModal({
								title:'友情提示',
								content:res.data.msg,
								showCancel:false,
								confirmText:'我知道了',
								success: (res) => {
								}
							});
						}
					}
				);
			},
			openAuthLocation(permissionID){
				this.permissionID = permissionID;//这个是对应的权限 ACCESS_FINE_LOCATION 位置权限 / WRITE_EXTERNAL_STORAGE 存储空间/照片权限 / CAMERA相机权限 / CALL_PHONE 拨打电话
				setTimeout(()=>{
					this.$refs['authpupLocation'].open();
				},200)
			},

			changeAuthLocation(){
				//这里是权限通过后执行自己的代码逻辑
				console.log('定位权限已授权，可执行自己的代码逻辑了');
				var a = this
				a.getLocation()
				a.getLocationMap()
			},
			goViolation(id){
				var a  = this
				if(a.info.refuse==null){
					uni.navigateTo({
						url:'/pages/index/violationDetail?order_id=' + this.info.order_no + '&refuse_id=' + id +'&is_refuse=1'
					})
				}else{
					uni.navigateTo({
						url:'/pages/index/violationDetail?order_id=' + this.info.order_no + '&refuse_id=' + id +'&is_refuse=0'
					})
				}
			},
			customConduct() {
				uni.navigateBack({
					delta: 1
				})
			},
			handleKfWx(){
				var a = this
				a.$refs.kfPopup.hide();
				a.is_opacity = false
				plus.share.getServices(res => {
					console.log(JSON.stringify(res));
					var sweixin = res.find(i => i.id === 'weixin')
					if (sweixin) {
						// 分享跳转到微信小程序
						sweixin.launchMiniProgram({
							id: "gh_088fa16acaff", // 	关联微信小程序的原始ID（"g_"开头的字符串）
							path: '/pages/index/kefu', //要打开小程序的路径
							type: 0 // 	微信小程序版本类型，可取值： 0-正式版； 1-测试版； 2-体验版。 默认值为0。
						}, res => {
							console.log('成功唤起微信小程序');
						}, err => {
							console.log('失败');
						})
					} else {
						// 没有获取到微信分享服务
					}
				}, err => {
					// 获取分享服务列表失败
				});
			},
			handleKfCall(){
				var a = this
				a.openAuthPhoneKf('CALL_PHONE')
				a.$refs.kfPopup.hide();
				// a.openAuth('CALL_PHONE')
			},
			//打开自定义权限目的弹框
			openAuth(permissionID){
				this.permissionID = permissionID;//这个是对应的权限 ACCESS_FINE_LOCATION 位置权限 / WRITE_EXTERNAL_STORAGE 存储空间/照片权限 / CAMERA相机权限 / CALL_PHONE 拨打电话
				setTimeout(()=>{
					this.$refs['authpup'].open();
				},200)
			},
			//用户授权权限后的回调
			changeAuth(){
				var a = this
				//这里是权限通过后执行自己的代码逻辑
				console.log('拨打电话权限已授权，可执行自己的代码逻辑了');
				a.$refs.kfPopup.hide();
				a.is_opacity = false
				var temp_str = '呼叫'+ a.kf_phone
				uni.showActionSheet({
					itemList: [temp_str],
					success: function(res) {
						console.log(res);
						if (res.tapIndex == 0) {
							uni.makePhoneCall({
								phoneNumber: a.kf_phone,
								success: (res) => {
									console.log('调用成功!')
								},
							})
						}
					}
				})
			},
			handleShowKf(){
				var a = this
				a.$refs.kfPopup.show();
				// a.is_opacity = true
				setTimeout(()=>{
					a.is_opacity = false
				},1300)
				// a.is_opacity = true
				// a.openAuthPhoneKf('CALL_PHONE')
			},
			//打开自定义权限目的弹框
			openAuthPhoneKf(permissionID){
				this.permissionID = permissionID;//这个是对应的权限 ACCESS_FINE_LOCATION 位置权限 / WRITE_EXTERNAL_STORAGE 存储空间/照片权限 / CAMERA相机权限 / CALL_PHONE 拨打电话
				setTimeout(()=>{
					this.$refs['authpupPhoneKf'].open();
				},200)
				var a = this
				setTimeout(()=>{
					a.is_opacity = false
				},4000)
			},
			changeAuthPhoneKf(){
				var a = this
				//这里是权限通过后执行自己的代码逻辑
				console.log('拨打电话权限已授权，可执行自己的代码逻辑了');
				var temp_str = '呼叫'+ a.kf_phone
				uni.showActionSheet({
					itemList: [temp_str],
					success: function(res) {
						console.log(res);
						if (res.tapIndex == 0) {
							uni.makePhoneCall({
								phoneNumber: a.kf_phone,
								success: (res) => {
									console.log('调用成功!')
								},
							})
						}
					}
				})
			},
			setScrollHeight(val) { // 实时返回的滑动组件高度
				this.currentHeight = val
			},
			setScrollViewHeight(val) { //最大高度
				this.scrollViewHeight = val
			},
			getLocationMap() {
				let a = this;
				console.log('执行了')

				uni.startLocationUpdate({
					type: 'gcj02',
					success: (ressss) => {
						console.log('执行了1',ressss)
						a.is_location = true
						const _locationChangeFn = function(res) {
							uni.setStorage({
								key: 'mylocation',
								data: res
							})
							console.log('获取到位置',res)
							a.sendLocation(res.latitude, res.longitude)
						}
						// 计算两点之间的距离（单位：米）
						function getDistance(lat1, lon1, lat2, lon2) {
						    const R = 6371000; // 地球半径，单位为米
						    const toRadians = (degrees) => degrees * (Math.PI / 180);

						    const dLat = toRadians(lat2 - lat1);
						    const dLon = toRadians(lon2 - lon1);

						    const a = Math.sin(dLat / 2) * Math.sin(dLat / 2) +
						              Math.cos(toRadians(lat1)) * Math.cos(toRadians(lat2)) *
						              Math.sin(dLon / 2) * Math.sin(dLon / 2);

						    const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));

						    return R * c; // 返回距离，单位为米
						}


						let lastLocation = null;
						uni.onLocationChange((res) => {
							// console.log('位置发生变化啦啦啦啦啦')
							const currentLocation = {
							    latitude: res.latitude,
							    longitude: res.longitude
							};
							// 如果lastLocation为空，则直接更新lastLocation
							if (!lastLocation) {
							    lastLocation = currentLocation;
							    _locationChangeFn(res);
							    // console.log('位置发生变化:', res);
							    return;
							}
							 // 计算距离
							const distance = getDistance(lastLocation.latitude, lastLocation.longitude, currentLocation.latitude, currentLocation.longitude);
							// console.log('两点之间的距离',distance)
							//如果距离大于100米，则执行_locationChangeFn
							if (distance > 100) {
							    lastLocation = currentLocation; // 更新lastLocation
							    _locationChangeFn(res);
							    // console.log('位置发生变化:', res);
							}
						});
						// uni.onLocationChange(_locationChangeFn)
					}
				})
			},
			sendLocation(lat, lng) {
				var a = this
				a.globalajax('user/modify', {
					lat: lat,
					lng: lng,
				}, 'POST', function(res) {
					console.log(res);
					uni.hideLoading()
					if (res.data.code == 200) {

					} else {
						a.$showModal({
							title:'友情提示',
							content:res.data.msg,
							showCancel:false,
							confirmText:'我知道了',
							success: (res) => {
							}
						});
					}
				});
			},
			getLocation() {
				let that = this;
				console.log('执行了这里')
				uni.showLoading({
					title:'加载中'
				})
				uni.getLocation({
					type: 'gcj02',
					geocode: true,
					isHighAccuracy:true,
					success: (res) => {
						uni.hideLoading()
						console.log('获取到位置了',res)
						that.user_latitude = res.latitude;
						that.user_longitude = res.longitude;
						that.map_latitude = 35.103771
						that.map_longitude = 118.356464
						this.$nextTick(() => {
							that.map_latitude  = res.latitude;
							that.map_longitude = res.longitude;
						});

						if(that.info.status == 'PENDING' || that.info.status == 'GRABBED' || that.info.status == 'PICKUP' ){
							that.setUserCovers(res.latitude,res.longitude)
							var temp_start = {
								lat:that.user_latitude,
								lng:that.user_longitude
							}
							var temp_end = {
								lat:that.latitude,
								lng:that.longitude
							}
							that.getUserRide(temp_start,temp_end)
						}


					},
					fail: function(res) {
						uni.hideLoading()
						console.log('没有获取到位置',res)
					}
				})
			},
			setUserCovers(lat,lng) {
				let that = this;
				var iconPath = 'https://www.cccshansong.com/chong_weapp/map_wo_icon2.png'
				var temp_marker = {
					iconPath:'../../static/map_wo_icon1.png',
					// iconPath:'',
					id: 2,
					name: '当前位置',//取货点
					latitude: lat*1,
					longitude: lng*1,
					width: 26,
					height: 43,
					anchor:{x: .5, y: .5},
					// label: null,
					label: {
					    content: '距取 ' + that.info.receiver_address_detail_complete.rider + 'km', // label内容
						fontSize: 12,
						borderRadius: 5,
						bgColor: '#ffffff',
						padding: 6,
						textAlign: 'center'
					},
					callout: {
						content: '当前位置',
						color: '#000000',
						fontSize: 9,
						borderRadius: 30,
						bgColor: '#ffffff',
						padding: 5
					}

				}

				that.covers.push(temp_marker)
			},
			setCovers(sender_address, receiver_address) {
				let that = this;
				console.log('***********',sender_address)
				var iconPath = 'https://www.cccshansong.com/chong_weapp/map_qu_icon1.png'
				var iconPath1 = 'https://www.cccshansong.com/chong_weapp/map_song_icon1.png'
				var temp_marker = {
					iconPath: '../../static/map_qu_icon1.png',
					id: 0,
					name: '取货点',//取货点
					latitude: sender_address.lat*1,
					longitude: sender_address.lng*1,
					width: 26,
					height: 43,
					label: null,
					callout: {
						content: '取货点',
						color: '#000000',
						fontSize: 9,
						borderRadius: 30,
						bgColor: '#ffffff',
						padding: 5
					}

				}
				var temp_marker1 = {
					iconPath:  '../../static/map_song_icon1.png',
					id: 1,
					name: '送货点',//送货点
					latitude: receiver_address.lat*1,
					longitude: receiver_address.lng*1,
					width: 26,
					height: 43,
					label: null,
					callout: {
						content: '送货点',
						color: '#000000',
						fontSize: 9,
						borderRadius: 30,
						bgColor: '#ffffff',
						padding: 5
					}

				}
				that.covers.push(temp_marker)
				that.covers.push(temp_marker1)
			},
			getUserRide(start_address, end_address) {
				var that = this
				// 起点
				var temp_sender_address = start_address
				var temp_sender_address_latlon = temp_sender_address.lng + ',' + temp_sender_address.lat;
				// 终点
				var temp_receiver_address = end_address
				var temp_receiver_address_latlon = temp_receiver_address.lng + ',' + temp_receiver_address.lat;
				that.myAmapFun.getRidingRoute({
					origin: temp_sender_address_latlon, // start
					destination: temp_receiver_address_latlon, // end
					success: function(data) {
						// 路线规划
						var points = [];
						if (data.paths && data.paths[0] && data.paths[0].rides) {
							var steps = data.paths[0].rides;
							for (var i = 0; i < steps.length; i++) {
								var poLen = steps[i].polyline.split(';');
								for (var j = 0; j < poLen.length; j++) {
									points.push({
										longitude: parseFloat(poLen[j].split(',')[0]),
										latitude: parseFloat(poLen[j].split(',')[1])
									})
								}
							}
						}

						// that.polyline = [{
						// 	points: points,
						// 	color: "#FF6B00",
						// 	dottedLine: false,
						// 	arrowLine: true,
						// 	width: 6
						// }]
						var temp_obj = {
							points: points,
							color: "#418AFF",
							dottedLine: false,
							arrowLine: true,
							width: 14
						}
						that.polyline.push(temp_obj)
						console.log('---', that.polyline)
					},
					fail: function(info) {

					}
				})
			},
			getRide(sender_address, receiver_address) {
				var that = this
				// 起点
				var temp_sender_address = sender_address
				var temp_sender_address_latlon = temp_sender_address.lng + ',' + temp_sender_address.lat;
				// 终点
				var temp_receiver_address = receiver_address
				var temp_receiver_address_latlon = temp_receiver_address.lng + ',' + temp_receiver_address.lat;
				that.myAmapFun.getRidingRoute({
					origin: temp_sender_address_latlon, // start
					destination: temp_receiver_address_latlon, // end
					success: function(data) {
						// 路线规划
						var points = [];
						if (data.paths && data.paths[0] && data.paths[0].rides) {
							var steps = data.paths[0].rides;
							for (var i = 0; i < steps.length; i++) {
								var poLen = steps[i].polyline.split(';');
								for (var j = 0; j < poLen.length; j++) {
									points.push({
										longitude: parseFloat(poLen[j].split(',')[0]),
										latitude: parseFloat(poLen[j].split(',')[1])
									})
								}
							}
						}

						// that.polyline = [{
						// 	points: points,
						// 	color: "#03D6D6",
						// 	dottedLine: false,
						// 	arrowLine: true,
						// 	width: 6
						// }]
						var temp_obj = {
							points: points,
							color: "#03D6D6",
							dottedLine: false,
							arrowLine: true,
							width: 14
						}
						that.polyline.push(temp_obj)
						console.log('---', that.polyline)
					},
					fail: function(info) {

					}
				})
			},
			goBackPage() {
				uni.navigateBack({
					delta: 1
				});
			},
			// S 移动拖拽
			movableChange(e) {
				let y = e.detail.y;
				this.dragY = y
				let c_h = this.cHeightNum + y;
				if (c_h >= 150) {
					this.mapHeight = c_h;
				}
				if (y > (-100)) {
					this.drageIco = 'down'
				} else {
					this.drageIco = 'up'
				}
			},
			touchEnd(e) {
				this.initY = this.dragY
				setTimeout(() => {
					if (this.dragY > (-100)) {
						this.initY = 0

					} else {
						this.initY = -(this.windowHeight - 150 - 140);
					}
				}, 100)

			},
			openHide() {
				if (this.drageIco == 'up') {
					this.initY = 0
				} else {
					this.initY = -(this.windowHeight - 150 - 140);
				}
			},
			handleMapLocation(){
				var a = this
				console.log('定位到当前位置')
				a.map_latitude = 35.103771
				a.map_longitude = 118.356464
				this.$nextTick(() => {
					a.map_latitude = a.user_latitude
					a.map_longitude = a.user_longitude
				});

			},
			regionchange(e) {
				let that = this;
				console.log(e)
				// if (e.type === 'end') {
				// 	that.map_latitude = e.detail.centerLocation.latitude
				// 	that.map_longitude = e.detail.centerLocation.longitude
				// }
			},
			handleMapRefresh(){
				var a = this
				console.log('点击刷新位置')
				if(a.refresh_status){
					a.refresh_status = false
					uni.showLoading({
						title:'加载中'
					})
					uni.getLocation({
						type: 'gcj02',
						success: (res) => {
							console.log(res)
							var temp_latitude = res.latitude;
							var temp_longitude = res.longitude;
							a.globalajax('user/modify', {
								lat: temp_latitude,
								lng: temp_longitude,
							}, 'POST', function(res) {
								console.log(res);
								uni.hideLoading()
								setTimeout(()=>{
									a.refresh_status = true
								},1500)
								if (res.data.code == 200) {
									a.getDetail()
								} else {
									a.$showModal({
										title:'友情提示',
										content:res.data.msg,
										showCancel:false,
										confirmText:'我知道了',
										success: (res) => {
										}
									});
								}
							});
						},

					})
				}
			},
		}
	}
</script>

<style lang="scss">
	.popup_content_title{
		text-align: center;
		padding-top: 30rpx;
		font-size: 32rpx;
	}
	.is_opacity_class{
		opacity: 0;
	}
	.phone_popup_item_box{
		width: 92%;
		margin: 0 auto;
		border-bottom: 2rpx solid #ebeef5;
		height: 120rpx;
		display: flex;
		align-items: center;
		image{
			width: 46rpx;
			height: 46rpx;
			margin-right: 30rpx;
		}
		text{
			font-size: 28rpx;
		}
	}
	.pay_popup_box {
		display: flex;
		align-items: center;
		justify-content: center;
		padding-top: 56rpx;

		.pay_popup_btn {
			// width: 286rpx;
			width: 320rpx;
			height: 80rpx;
			text-align: center;
			line-height: 80rpx;
			border: 2rpx solid rgba(228, 231, 237, 1);
			border-radius: 16rpx;
			font-size: 30rpx;
			color: rgba(36, 40, 49, 1);
		}

		.pay_popup_btn1 {
			// width: 286rpx;
			width: 320rpx;
			height: 80rpx;
			text-align: center;
			line-height: 80rpx;
			border-radius: 16rpx;
			font-size: 30rpx;
			color: #fff;
			margin-left: 20rpx;
			background-color: #418AFF;
		}
	}
	.ask_img_box{
		width: 600rpx;
		margin-left: 30rpx;
		position: relative;
		.ask_img_num{
			position: absolute;
			top: 28rpx;
			right: 30rpx;
			color: #909399;
			font-size: 24rpx;
		}
		.ask_title{
			padding-top: 28rpx;
			font-size: 30rpx;
			color: rgba(48, 49, 51, 1);
		}
		.img_list{
			display: flex;
			width: 600rpx;
			margin: 0 auto;
			margin-top: 10rpx;
			// flex-wrap: wrap;
		}
	}
	.rotate-image {
	  width: 144rpx; /* 根据实际需求设置图片宽度 */
	  height:  144rpx; /* 根据实际需求设置图片高度 */
	  animation: rotate 2s linear infinite; /* 设置旋转动画 */
	}

	@keyframes rotate {
	  from {
	    transform: rotate(0deg); /* 从0度开始旋转 */
	  }
	  to {
	    transform: rotate(360deg); /* 旋转到360度 */
	  }
	}
	.custom_service_order_reckon_box{
		width:144rpx;
		height: 144rpx;
		margin: 0 auto;
		margin-top: 12rpx;
		position: relative;
		.custom_service_order_reckon_info_box{
			position: absolute;
			top:18rpx;
			left: 18rpx;
			width: 112rpx;
			height: 112rpx;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			border-radius: 50%;
			color: #FFF;
			font-size: 64rpx;
			text-align: center;
			line-height:  112rpx;
			font-weight: bold;
		}
		image{
			width: 100%;
			height: 100%;
		}
	}
	.xiuxi_popup_bj {
		// width: 640rpx;
		width: 750rpx;
		height: 356rpx;
		background-image: url('https://www.cccshansong.com/chong_weapp/xiuxi_popup_bj.png');
		background-size: 100% 100%;
		background: linear-gradient(180deg,#94bbfb,#fff,#fff);

		.xiuxi_popup_tip_img {
			width: 144rpx;
			height: 144rpx;
			margin: 0 auto;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.xiuxi_popup_tip_text {
			text-align: center;
			font-weight: bold;
			color: rgba(36, 40, 49, 1);
			font-size: 40rpx;
			margin-top: 20rpx;
		}
	}
	.qiang_ucc_popup_tip{
		text-align: center;
		color: rgba(96, 98, 102, 1);
		font-size: 30rpx;
		margin-top: -30rpx;
	}
	.qiang_fail_btn{
		width: 288rpx;
		height: 80rpx;
		text-align: center;
		line-height: 80rpx;
		color: #fff;
		font-size: 30rpx;
		margin: 0 auto;
		background-color: #418AFF;
		border-radius: 16rpx;
		margin-top: 66rpx;
	}
	.qiang_ucc_popup_tip{
		text-align: center;
		color: rgba(96, 98, 102, 1);
		font-size: 30rpx;
		margin-top: -30rpx;
	}
	.top_nav_box {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 999999;
	}
	.order_top_tip{
		position: absolute;
		left:88rpx;
		top: 0;
		z-index: 999;
		width: 458rpx;
		height: 40rpx;
		background-color: rgba(246, 233, 226, 1);
		border: 2rpx solid rgba(255, 107, 0, 0.1);
		border-radius: 10rpx;
		text-align: center;
		line-height: 40rpx;
		color: rgba(36, 40, 49, 1);
		font-size: 24rpx;
	}
	.event-help-details {
		width: 100%;
		height: 100vh;
		display: flex;
		flex-direction: column;
		position: relative;
		.scroll_content_box{
			width: 750rpx;
			height: 60vh;
			padding-top: 20rpx;
			box-sizing: border-box;
			// background-color: blueviolet;
		}
	}
	.map_icon_box1{
		position: absolute;
		top: 700rpx;
		z-index: 2;
		right: 20rpx;
		background-color: #fff;
		width: 68rpx;
		height: 68rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 6rpx;
		image{
			width: 44rpx;
			height: 44rpx;
		}
	}
	.map_icon_box2{
		position: absolute;
		top: 784rpx;
		z-index: 2;
		right: 20rpx;
		background-color: #fff;
		width: 68rpx;
		height: 68rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 6rpx;
		image{
			width: 44rpx;
			height: 44rpx;
		}
	}
	.back-last-page {
		width: 60rpx;
		height: 60rpx;
		position: fixed;
		left: 30rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 999999;
	}

	.map-content {
		width: 100%;
		background-color: #eee;
		background-image: url('https://www.cccshansong.com/chong_weapp/map_bj1.png');
		background-repeat: no-repeat;
		background-size: cover;
		// position: absolute;
		// top: 0;
		// left: 0;
		// z-index: 1;
		.map-gis {
			width: 100%;
			height: 100%;
			position: relative;
			.controls-title{
				position: absolute;
				left:50%;
				transform: translateX(-50%);
				top: 20rpx;
				width: 522rpx;
				height: 54rpx;
				background: #F0F9FF;
				border-radius: 10rpx;
				text-align: center;
				line-height: 54rpx;
				color: #333;
				font-size: 24rpx;
			}
			.controls-play{
				position: absolute;
				top: 300rpx;
				z-index: 999999999999;
				right: 20rpx;
				background-color: #fff;
				width: 80rpx;
				height: 80rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				border-radius: 6rpx;
			}
			.controls-play1{
				position: absolute;
				top: 400rpx;
				z-index: 999999999999;
				right: 20rpx;
				background-color: #fff;
				width: 80rpx;
				height: 80rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				border-radius: 6rpx;
			}
		}
	}

	// S 滑动块
	.move-content {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 680rpx;
	}

	.move-incontent {
		width: 100%;
		background-color: #fff;
		border-radius: 32rpx 32rpx 0 0;
		z-index: 4;
	}

	.move-drag-ico {
		width: 100%;
		height: 60rpx;
		display: flex;
		align-items: center;
		justify-content: center;

		.drag-img {
			width: 50rpx;
			height: 22rpx;
			transition: all .3s;
		}

		.drag-transform {
			transform: rotate(-180deg);
		}
	}

	// 滚动内容
	.move-infos-body {}
	.fix_kf_box{
		position: fixed;
		z-index: 999997;
		right: 24rpx;
		bottom:300rpx;
		width: 88rpx;
		height: 88rpx;
		border-radius: 50%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		background-color: #fff;
		box-shadow: 0 0 20rpx rgba(0, 0, 0, 0.1);
		image{
			width: 40rpx;
			height: 40rpx;
		}
		text{
			color: rgba(36, 40, 49, 1);
			font-size: 20rpx;
		}
	}
	.orderInfo{
		padding: 0 12rpx;
		.li{
			padding: 16rpx 24rpx 24rpx 24rpx;
			margin-bottom: 32rpx;
			.top{
				height: 68rpx;
				display: flex;
				align-items: center;
				justify-content: space-between;
				border-bottom: 1rpx solid #418AFF;
				.fl{
					display: flex;
					align-items: center;
					.h1{
						font-size: 48rpx;
						color: #FF3C26;
						font-weight: bold;
						text{
							font-size: 28rpx;
							font-weight: 400;
						}
					}
					.h2{
						width: 72rpx;
						height: 36rpx;
						border-radius: 8rpx 8rpx 8rpx 8rpx;
						border: 2rpx solid #418AFF;
						font-size: 20rpx;
						color: #418AFF;
						line-height: 36rpx;
						text-align: center;
						margin-left: 26rpx;
					}
				}
				.fr{
					display: flex;
					align-items: center;
					.h1{
						width: 74rpx;
						height: 40rpx;
						background: #FF9626;
						border-radius: 32rpx 8rpx 8rpx 32rpx;
						display: flex;
						align-items: center;
						justify-content: center;
						image{
							width: 25rpx;
							height: 24rpx;
						}
						text{
							font-size: 20rpx;
							color: #fff;
							margin-left: 8rpx;
							display: inline-block;
						}
					}
					.h2{
						font-size: 28rpx;
						color: #418AFF;
						margin-left: 8rpx;
					}
					.h3{
						font-size: 28rpx;
						color: #666;
					}
				}
			}
			.center{
				padding-top: 24rpx;
				.start{
					display: flex;
					align-items: center;
					justify-content: space-between;
					.fl{
						flex: 1;
						padding-right: 25rpx;
						.h1{
							display: flex;
							align-items: center;
							.h1Fl{
								width: 55rpx;
								text-align: center;
								.point{
									display: inline-block;
									width: 16rpx;
									height: 16rpx;
									background: #418AFF;
									border-radius: 50%;
								}
								.distance{
									.num{
										font-size: 16rpx;
										color: #418AFF;
									}
									.km{
										font-size: 16rpx;
										color: #666;
									}
								}
							}
							.h1Fr{
								flex: 1;
								padding-left: 25rpx;
								.big{
									font-size: 32rpx;
									color: #333;
								}
								.small{
									font-size: 24rpx;
									color: #666;
									margin-top: 8rpx;
								}
							}
							/*&:after{
								content: '';
								display: block;
								width: 16rpx;
								height: 16rpx;
								background: #418AFF;
								position: absolute;
								left: 8rpx;
								top: 50%;
								transform: translateY(-50%);
								border-radius: 50%;
							}*/
						}
						.h2{
							display: flex;
							margin-top: 8rpx;
							align-items: center;
							padding-left: 10rpx;
							image{
								width: 32rpx;
								height: 62rpx;
							}
							.h2Con{
								text-align: center;
								.num{
									font-size: 16rpx;
									color: #418AFF;
								}
								.km{
									font-size: 16rpx;
									color: #666;
								}
							}
						}
					}
					.fr{
						image{
							width: 72rpx;
							height: 72rpx;
						}
					}
				}
				.end{
					display: flex;
					align-items: center;
					justify-content: space-between;
					margin-top: 20rpx;
					.fl{
						flex: 1;
						padding-right: 25rpx;
						.h1{
							display: flex;
							align-items: center;
							.h1Fl{
								width: 55rpx;
								text-align: center;
								.point{
									display: inline-block;
									width: 16rpx;
									height: 16rpx;
									background: #FF3C26;
									border-radius: 50%;
								}
								.distance{
									.num{
										font-size: 16rpx;
										color: #418AFF;
									}
									.km{
										font-size: 16rpx;
										color: #666;
									}
								}
							}
							.h1Fr{
								flex: 1;
								padding-left: 25rpx;
								.big{
									font-size: 32rpx;
									color: #333;
								}
								.small{
									font-size: 24rpx;
									color: #418AFF;
									display: flex;
									margin-top: 8rpx;
									text{
										color: #666;
									}
								}
								.phone{
									display: flex;
									align-items: center;
									justify-content: space-between;
									margin-top: 24rpx;
									.h4{
										height: 50rpx;
										border-radius: 8rpx 8rpx 8rpx 8rpx;
										border: 2rpx solid #418AFF;
										display: flex;
										align-items: center;
										justify-content: space-between;
										padding: 0 16rpx;
										box-sizing: border-box;
										text{
											font-size: 24rpx;
											color: #333;
										}
										image{
											width: 32rpx;
											height: 32rpx;
											margin-left: 32rpx;
										}
									}
									.h5{
										width: 160rpx;
										height: 50rpx;
										background: #418AFF;
										border-radius: 8rpx 8rpx 8rpx 8rpx;
										font-size: 24rpx;
										color: #fff;
										text-align: center;
										line-height: 50rpx;
									}
								}
							}
							/*&:after{
								content: '';
								display: block;
								width: 16rpx;
								height: 16rpx;
								background: #418AFF;
								position: absolute;
								left: 8rpx;
								top: 50%;
								transform: translateY(-50%);
								border-radius: 50%;
							}*/
						}
						.h2{
							display: flex;
							margin-top: 8rpx;
							align-items: center;
							padding-left: 10rpx;
							image{
								width: 32rpx;
								height: 62rpx;
							}
							.h2Con{
								text-align: center;
								.num{
									font-size: 16rpx;
									color: #418AFF;
								}
								.km{
									font-size: 16rpx;
									color: #666;
								}
							}
						}
					}
					.fr{
						image{
							width: 72rpx;
							height: 72rpx;
						}
					}
				}
				.notes{

					background: #EEEEEE;
					border-radius: 16rpx 16rpx 16rpx 16rpx;
					padding: 14rpx 16rpx;
					line-height: 35rpx;
					display: flex;
					/*align-items: center;*/
					margin-top: 24rpx;
					.h1{
						font-size: 24rpx;
						color: #333;
					}
					.h2{
						font-size: 24rpx;
						color: #666;
						flex:1;
					}
				}

				.scroll_item_order_btn_box {
					display: flex;
					align-items: center;
					justify-content: center;
					margin-top: 26rpx;

					.scroll_item_order_btn1 {
						width: 228rpx;
						height: 88rpx;
						line-height: 88rpx;
						text-align: center;
						color: #fff;
						background-color: rgba(255, 168, 0, 1);
						border-radius: 12rpx;
						font-size: 32rpx;
						margin-right: 20rpx;
					}

					.scroll_item_order_btn2 {
						flex:1;
						height: 88rpx;
						line-height: 88rpx;
						text-align: center;
						color: #fff;
						background-color: #418AFF;
						border-radius: 12rpx;
						font-size: 32rpx;
					}

					.scroll_item_order_btn3 {
						height: 88rpx;
						display: flex;
						flex-direction: column;
						align-items: center;
						justify-content: center;
						padding: 0 16rpx;
						margin-right: 20rpx;
						text{
							color: rgba(96, 98, 102, 1);
							font-size: 24rpx;
							padding-top: 10rpx;
							padding-bottom: 0;
						}
						image {
							width: 36rpx;
							height: 36rpx;
						}
					}

					.scroll_item_order_btn4 {
						width: 544rpx;
						height: 88rpx;
						line-height: 88rpx;
						text-align: center;
						color: #fff;
						background-color: rgba(0, 117, 255, 1);
						border-radius: 12rpx;
						font-size: 32rpx;
					}

					.scroll_item_order_btn5 {
						width: 544rpx;
						height: 88rpx;
						line-height: 88rpx;
						text-align: center;
						color: #fff;
						background-color: rgba(44, 190, 118, 1);
						border-radius: 12rpx;
						font-size: 32rpx;
					}
				}
			}
		}
	}
	.order_content_box_heng{
		background-color: rgba(235, 238, 245, 1);
		width: 750rpx;
		height: 2rpx;
		margin: 24rpx 0;
	}
	.violation_content_box{
		display: flex;
		margin-top: 16rpx;
		align-items: center;
		padding-bottom: 24rpx;
		border-bottom: 2rpx solid rgba(235, 238, 245, 1);
		justify-content: space-between;
		margin-bottom: 20rpx;
		.violation_content_left_box{
			color: rgba(36, 40, 49, 1);
			font-size: 36rpx;
			font-weight: bold;
			width: 450rpx;
			white-space: nowrap;
			text-overflow: ellipsis;
			overflow: hidden;
			word-break: break-all;
			margin-left: 24rpx;
		}
		.violation_content_right_box{
			display: flex;
			align-items: center;
			.violation_content_right_btn{
				width: 168rpx;
				height: 60rpx;
				text-align: center;
				line-height: 60rpx;
				text-align: center;
				color: #fff;
				font-size: 28rpx;
				background-color: #418AFF;
				border-radius: 12rpx;
			}
			image{
				width: 40rpx;
				height: 40rpx;
				margin-right: 16rpx;
			}
		}
	}
	.scroll_item_order_top_top_box{
		display: flex;
		margin-top: 16rpx;
		align-items: center;
		padding-bottom: 24rpx;
		border-bottom: 2rpx solid rgba(235, 238, 245, 1);
		.scroll_item_order_top_top_box_title{
			font-weight: bold;
			color: rgba(36, 40, 49, 1);
			font-size: 48rpx;
			margin-right: 30rpx;
			margin-left: 24rpx;
		}
		.scroll_item_order_status{
			height: 48rpx;
			line-height: 48rpx;
			padding: 0 16rpx;
			border-radius: 6rpx;
			background-color: #418AFF;
			color: #fff;
			font-size: 24rpx;
		}
	}
	.order_content_box{
		width: 686rpx;
		margin: 0 auto;
		.order_content_time_box{
			display: flex;
			align-items: center;
			justify-content: center;
			padding-top: 20rpx;
			.order_content_time_item_box{
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				// padding: 0 32rpx;
				width: 144rpx;
				margin: 0 10rpx;
				.order_content_time_item_time{
					color: #418AFF;
					font-size: 36rpx;
					font-weight: bold;
				}
				.order_content_time_item_name{
					color: #333333;
					font-size: 24rpx;
					font-weight: bold;
				}
			}
		}
		.order_content_title_tip{
			color: rgba(144, 147, 153, 1);
			font-size: 28rpx;
			margin-left:20rpx;
			padding-bottom: 24rpx;
		}

		.order_content_title_box{
			display: flex;
			align-items: center;
			justify-content: space-between;
			.order_content_title_rule1{
				color: rgba(36, 40, 49, 1);
				font-size: 32rpx;
				font-weight: bold;
			}
			.order_content_title_rule{
				display: flex;
				align-items: center;
				color: rgba(36, 40, 49, 1);
				font-size: 28rpx;
				image{
					margin-right: 10rpx;
					width: 28rpx;
					height: 28rpx;
				}
			}
			.order_content_title{
				display: flex;
				align-items: center;
				margin-bottom: 20rpx;
				.order_content_title_xian{
					width: 2rpx;
					height: 36rpx;
					background-color: #418AFF;
				}
				.order_content_title_text{
					/*font-weight: bold;*/
					color: #333;
					font-size: 36rpx;
					margin-left:14rpx ;
				}
			}

		}
		.order_content_img_box{
			width: 686rpx;
			display: flex;
			flex-wrap: wrap;
			.order_content_img_item{
				width: 210rpx;
				height: 210rpx;
				margin-right: 18rpx;
				margin-bottom: 20rpx;
				image{
					border-radius: 16rpx;
					width: 100%;
					height: 100%;
				}
			}
		}
		.order_content_title{
			display: flex;
			align-items: center;
			margin-bottom: 20rpx;
			.order_content_title_xian{
				width:4rpx;
				height: 36rpx;
				background-color: #418AFF;
			}
			.order_content_title_text{
				/*font-weight: bold;*/
				color: #333;
				font-size: 36rpx;
				margin-left:14rpx ;
			}
		}
		.order_content_info_item_box{
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding-bottom: 20rpx;
			.order_content_info_item_box_left{
				color: rgba(36, 40, 49, 1);
				font-size: 28rpx;
				margin-left: 20rpx;
			}
			.order_content_info_item_box_right{
				color: rgba(36, 40, 49, 1);
				font-size: 28rpx;
				display: flex;
				align-items: center;
				text{
					color: #418AFF;
					font-size: 32rpx;
				}
				.order_content_info_item_box_right_copy{
					margin-left: 16rpx;
					width: 72rpx;
					height: 40rpx;
					text-align: center;
					line-height: 40rpx;
					color: rgba(36, 40, 49, 1);
					font-size: 24rpx;
					border-radius: 10rpx;
					border: 2rpx solid rgba(144, 147, 153, 1);
				}
			}
		}
		.scroll_item_order_remark_box{
			width: 624rpx;
			padding-top: 12rpx;
			padding-bottom: 12rpx;
			padding-left: 16rpx;
			padding-right: 16rpx;
			margin: 0 auto;
			margin-top: 24rpx;
			background-color: rgba(245, 246, 248, 1);
			font-size: 26rpx;
			color: rgba(96, 98, 102, 1);
			border-radius: 12rpx;
			text{
				color: rgba(48, 49, 51, 1);
			}
		}
		.scroll_item_order_status_box{
			display: flex;
			align-items: center;
			margin-left: 62rpx;
			margin-top: 20rpx;
			.scroll_item_order_status{
				height: 48rpx;
				line-height: 48rpx;
				padding: 0 16rpx;
				border-radius: 6rpx;
				background-color: rgba(255, 107, 0, 1);
				color: #fff;
				font-size: 24rpx;
			}
			.scroll_item_order_status1{
				background-color: rgba(3, 214, 214, 1);
			}
			.scroll_item_order_status2{
				background-color: rgba(0, 124, 239, 1);
			}
			.scroll_item_order_status3{
				background-color: rgba(44, 190, 118, 1);
			}
			.scroll_item_order_status_phone{
				height: 48rpx;
				line-height: 48rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				padding: 0 16rpx;
				color: rgba(36, 40, 49, 1);
				font-size: 28rpx;
				border: 2rpx solid rgba(228, 231, 237, 1);
				border-radius: 6rpx;
				margin-right: 20rpx;
				text{
					color: rgba(255, 107, 0, 1);
				}
				image{
					width: 32rpx;
					height: 32rpx;
					margin-left: 14rpx;
				}
			}
		}
		.scroll_item_order_center_box{
			margin-top: 10rpx;
			.qu_address_item_box{
				display: flex;
				justify-content: space-between;
				.dh_icon_box{
					width: 56rpx;
					height: 56rpx;
					// margin-right: 20rpx;
					margin-top: 10rpx;
					image{
						width: 100%;
						height: 100%;
					}
				}
				.qu_address_item_left_box{
					display: flex;
					margin-top: 14rpx;
					.qu_address_icon_box_content{
						margin-left: 20rpx;
						display: flex;
						flex-direction: column;
						align-items: center;
						flex: 1;
						.qu_address_xian_box{
							width: 2rpx;
							margin-top: 18rpx;
							height: auto;
							min-height: 74rpx;
							background-color:rgba(124, 132, 156, 0.85);
							position: relative;
							flex: 1;
							.qu_address_xian_box_container{
								position: absolute;
								top: 50%;
								left: 50%;
								width:80rpx;
								// height: 24rpx;
								transform: translate(-50%, -50%);
								display: flex;
								flex-direction: column;
								align-items: center;
								justify-content: center;
								background-color: #fff;
							}
							image{
								position: absolute;
								top: 50%;
								left: 50%;
								width:20rpx;
								height: 24rpx;
								transform: translate(-50%, -50%);
							}
						}
						.qu_address_icon_box {
							width: 46rpx;
							display: flex;
							flex-direction: column;
							align-items: center;
							justify-content: center;
							margin-top: 10rpx;
							image {
								width: 46rpx;
								height: 36rpx;
							}
						}
					}
					.qu_address_box{
						margin-left: 20rpx;
						.qu_address_title{
							color: rgba(36, 40, 49, 1);
							font-size: 36rpx;
							font-weight: bold;
							width: 454rpx;
							 text-overflow: -o-ellipsis-lastline;
							  overflow: hidden;
							  text-overflow: ellipsis;
							  display: -webkit-box;
							  -webkit-line-clamp: 4;
							  line-clamp: 4;
							  -webkit-box-orient: vertical;
						}
						.qu_address_desc{
							color: rgba(96, 98, 102, 1);
							font-size: 26rpx;
							width: 454rpx;
							// white-space: nowrap;
							// text-overflow: ellipsis;
							// overflow: hidden;
							// word-break: break-all;
							margin-top: 6rpx;
						}
					}
				}
			}


		}
		.scroll_item_order_no_box{
			display: flex;
			align-items: center;
			justify-content: space-between;
			.scroll_item_order_no_left{
				font-weight: bold;
				font-size: 36rpx;
				color: #242831;
			}
			.scroll_item_order_no_right{
				color: #333;
				font-size: 48rpx;
				/*font-weight: bold;*/
				text{
					margin-right: 6rpx;
					font-size: 28rpx;
				}
			}
		}
		.scroll_item_order_top_box{
			display: flex;
			align-items: center;
			justify-content: space-between;
			border-bottom: 1rpx solid #418AFF;
			padding-bottom: 24rpx;
			.scroll_item_order_top_price{
				display: flex;
				align-items: center;
				// padding-right: 20rpx;
				.scroll_item_order_top_price_tip{
					color: rgba(144, 147, 153, 1);
					font-size: 26rpx;
					margin-right: 10rpx;
				}
				.scroll_item_order_top_price_num{
					color: #FF3C26;
					font-size: 48rpx;
					font-weight: bold;
					text{
						font-weight: 400;
						font-size: 28rpx;
						margin-right: 6rpx;
					}
				}
			}

			.scroll_item_order_top_time{
				display: flex;
				align-items: center;
				color: #418AFF;
				font-size: 26rpx;
				// margin-left: 20rpx;
				image{
					width: 28rpx;
					height: 28rpx;
					margin-right: 8rpx;
				}
				.yu{
					display: inline-block;
					width: 50rpx;
					height: 40rpx;
					background-color: rgba(255, 168, 0, 1);
					text-align: center;
					line-height: 40rpx;
					color: #fff;
					font-size: 24rpx;
					margin-right: 10rpx;
					border-radius: 6rpx;
				}
			}
		}
	}
	.kfPopup_content{
		// width: 640rpx;
		width: 750rpx;
		height: 364rpx;
		/*background-image: url('https://www.cccshansong.com/chong_weapp/order_detail_icon5.png');*/
		background: linear-gradient(180deg,#94bbfb,#fff,#fff);
		background-size: 100% 100%;
		.kf_btn_title{
			text-align: center;
			font-size: 44rpx;
			padding: 36rpx 0;
			font-weight: bold;
		}
		.kf_btn_title1{
			text-align: center;
			font-size: 32rpx;
			font-weight: bold;
		}
		.kf_btn_box{
			display: flex;
			align-items: center;
			justify-content: center;
			margin-top: 66rpx;
			.kf_btn1{
				width: 280rpx;
				height: 80rpx;
				text-align: center;
				line-height: 80rpx;
				color: #418AFF;
				font-size: 30rpx;
				border-radius: 16rpx;
				border: 2rpx solid #418AFF;
			}
			.kf_btn2{
				width: 280rpx;
				height: 80rpx;
				text-align: center;
				line-height: 80rpx;
				color: #fff;
				font-size: 30rpx;
				border-radius: 16rpx;
				border: 2rpx solid #418AFF;
				background-color: #418AFF;
				position: relative;
				margin-left: 30rpx;
				.leftBox{
					position: absolute;
					top: 0;
					left: 0;
					width: 280rpx;
					height: 80rpx;
					opacity: 0;
				}
			}
		}
	}
	.order_top_tip{
		position: absolute;
		left:88rpx;
		top: 0;
		z-index: 999;
		width: 458rpx;
		height: 40rpx;
		background-color: rgba(246, 233, 226, 1);
		border: 2rpx solid rgba(255, 107, 0, 0.1);
		border-radius: 10rpx;
		text-align: center;
		line-height: 40rpx;
		color: rgba(36, 40, 49, 1);
		font-size: 24rpx;
	}
	.fix_detail_box_new{
		position: fixed;
		left: 0;
		bottom: 0;
		z-index: 19999;
		width: 750rpx;
		padding: 16rpx 32rpx 0 32rpx;
		box-shadow: 0rpx 0rpx 26rpx 0rpx rgba(0,0,0,0.0800);
		padding-bottom: calc(16rpx +  constant(safe-area-inset-bottom));
		padding-bottom: calc(16rpx +  env(safe-area-inset-bottom));
		background-color: #fff;
		display: flex;
		align-items: center;
		justify-content: space-between;
		box-sizing: border-box;
		/*gap: 26rpx;*/
		.li{
			/*flex: 1;*/
			height: 80rpx;
			border-radius: 24rpx 24rpx 24rpx 24rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			image{
                width: 39rpx;
				height: 39rpx;
				margin-right: 8rpx;
			}
			text{
				font-size: 28rpx;
				color: #fff;
			}
			&.red{
				background: #FF7565;
			}
			&.blue{
				background: #418AFF;
			}
			&.orange{
				background: #FF9641;
			}
		}
	}
	.fix_detail_box{
		position: fixed;
		left: 0;
		bottom: 0;
		z-index: 19999;
		width: 750rpx;
		padding-top: 16rpx;
		box-shadow: 0rpx 0rpx 26rpx 0rpx rgba(0,0,0,0.0800);
		padding-bottom: calc(16rpx +  constant(safe-area-inset-bottom));
		padding-bottom: calc(16rpx +  env(safe-area-inset-bottom));
		background-color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		.scroll_item_order_btn1{
			width: 228rpx;
			height: 88rpx;
			line-height: 88rpx;
			text-align: center;
			color: #fff;
			background-color: rgba(255, 168, 0, 1);
			border-radius: 12rpx;
			font-size: 32rpx;
			margin-right: 20rpx;
		}
		.scroll_item_order_btn2{
			width:454rpx;
			height: 88rpx;
			line-height: 88rpx;
			text-align: center;
			color: #fff;
			background-color: rgba(255, 107, 0, 1);
			border-radius: 12rpx;
			font-size: 32rpx;
		}
		.scroll_item_order_btn3{
			// height: 88rpx;
			// line-height: 88rpx;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			padding: 0 16rpx;
			margin-right: 20rpx;
			text{
				color: rgba(36, 40, 49, 1);
				font-size: 24rpx;
			}
			image{
				width: 48rpx;
				height: 48rpx;
			}
		}
		.scroll_item_order_btn4{
			width: 464rpx;
			height: 88rpx;
			line-height: 88rpx;
			text-align: center;
			color: #fff;
			background-color:rgba(0, 117, 255, 1);
			border-radius: 12rpx;
			font-size: 32rpx;
			margin-left: 36rpx;
		}
		.scroll_item_order_btn5{
			width:550rpx;
			height: 88rpx;
			line-height: 88rpx;
			text-align: center;
			color: #fff;
			background-color:rgba(44, 190, 118, 1);
			border-radius: 12rpx;
			font-size: 32rpx;
			// margin-left: 30rpx;
		}
	}
</style>
